問題タブ [postcss]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
495 参照

css - 列のカスタム幅を正しい方法で設定するには?

2 つの列を持つグリッド (「失われたグリッド」を使用しています) があります。1 つは 300px で 2 つ目は 630px、コンテナは 950px (20px は余白になります)。コードは次のとおりです。

次のように幅を設定しても大丈夫ですか: (0.65895/2)、または何か間違っていますか? このように設定すると、(1/2)必要な幅が得られません。

0 投票する
1 に答える
728 参照

sass - Gulp の Sass で PostCSS を使用して font-awesome を実行する

こんにちは、postcss レイアウトで font-awesome を使用しようとしていますが、うまくいかないようです。だから私は投稿でsassをインストールして、それが機能するかどうかを確認しようとしましたが、どうすればよいかわかりません。

私はすでにsass用にnpm gulpをインストールしています

これは私のgulpファイル構成です

そして、このsass構成を追加しようとしています

0 投票する
1 に答える
2709 参照

webpack - @import ファイルの変更時に Webpack と Precss がリロードされない

私は基本的な Webpack インストールをセットアップしており、PostCSS と PreCSS プラグインを使用して、@imported ファイル内の前処理された CSS をブラウザーで自動的にリロードしたいと考えます。現在、@imported ファイルを変更して保存すると、ブラウザーは更新されません (以下の例では body.css)。次に、ルート参照 CSS ファイル (styles.css) を保存すると、ブラウザーが更新され、@imported ファイルに加えられた変更も反映されます。

構成可能な webpack-dev-server と server.js を使用してみました。ホット モデル リロード (HMR) をインストールせずに試してみました。

@imported CSSファイルをwebpackに監視させる方法はありますか、それとも根本的に何かが欠けていますか?

パッケージ.json

webpack.config.js

index.html

entry.js

スタイル.css

body.css

0 投票する
1 に答える
576 参照

sass - Gulp postcss ロスト グリッド システム - フレームワーク

失われたパッケージがインストールされた gulp ファイルを取得しましたが、タスクの実行時に css が正しくコンパイルされていないようです。

私のgulpタスクは次のとおりです。

助けていただければ幸いです。よろしくお願いします。

編集: CSS 出力は期待どおりではありません。たとえば、CSS は次のようにレンダリングされます: .grid-one lost-utility: clearfix with: 100% div lost-column: 1/6

0 投票する
2 に答える
33920 参照

node.js - 「約束が定義されていません」というメッセージが表示されるのはなぜですか。ノード v5.7.0 でのエラー

postcssautoprefixerを使用しており、新しい Linux サーバーに移動した後、何かが間違っているに違いありませんが、これが何であるかわかりません。エラーが発生します:

これは以下によって引き起こされます:

私はこの問題を調査しましたが、問題の発生はすべて非常に初期のバージョンの node.js で発生しているようです。たとえば、次のようになります。

そして、解決策は常に「ノードの更新」のようです。

しかし、私のものは最新のようです:

私の問題は何ですか?

0 投票する
2 に答える
2975 参照

twitter-bootstrap - postcss-module および react-css-module で react-bootstrap を使用するには?

以下は私の Greeter.jsx ファイルです。

以下は私のmain.jsファイルです:

postcss-modules と react-css-modulesを使用して、コンポーネント内のセレクターを分離します。これにより、ファイルが読み込まれると、クラス名が _3lmHzYQ1tO8xPJFY8ewQax のようになります。

例:

以下は、react-bootstrap が出力を与える方法です。

styleName(react-css-modules) ではなく bsStyle (react-bootstrap) を使用しているため、分離されていないため、要素にブートストラップ css スタイルを適用できません。

postcss-modules が生成する出力と一致するようにクラスを分離することで、react-bootstrap を使用できる方法はありますか?

ありがとうございます。

0 投票する
1 に答える
982 参照

javascript - Webpack: 'style-loader!css-loader!postcss-loader' がインポートされたファイルを処理しないのはなぜですか?

index.css を @import する page.css があります。

page.css と index.css の両方がありますdisplay: flex

Webpack.config.js には以下が含まれます。

ビルド後、page.css のルールでプレフィックスを取得しましたが、index.css のルールにはプレフィックスがありませんでした。私は何を間違っていますか?

0 投票する
2 に答える
2959 参照

webpack - webpack で cssnext から postcss-cssnext に変換する

現在廃止されている cssnext および cssnext-loader の使用から、postcss-cssnext および postcss-loader への webpack 構成の変換に問題があります。私が再作成しようとしている機能は機能固有のプラグインに委譲されているというDocの状態は明らかですが、まだ機能していないようです。その一例が css 変数です。

私の現在の作業 webpack 構成は次のようになります。

...プラグインのインポート

...ローダー構成

...postcss 設定

問題:

新しい postcss-cssnext モジュールを指すように cssnext インポートを交換し、css 変数 (postcss-custom-properties) を処理するために必要になったモジュールを追加しました。cssnext-loader も削除しましたが、postcss-loader で処理できると想定していますか???

...プラグインのインポート

...ローダー構成

...postcss 設定

すべてのスタイルがページにレンダリングされていることがわかりますが、どの CSS 変数も評価されていません。中心的な問題は、「cssnext-loader」の使用に関連しているようです。再度追加すると、変数が機能します。postcss-import とさまざまな構成の反復を試しましたが、何も機能していないようです。誰かが私が間違っていることについて何か考えがありますか? postcss-cssnext、postcss-loader、css 変数、および webpack を連携させるにはどうすればよいですか?