0
webpackは、ファイルを処理するためにsass-loaderモジュールで構成されています。ここでは設定ファイルからチャンクがある：webpackでSCSS @ importの処理オーダー
{
test: /\.scss$/,
loaders: ["react-hot", "style", "css?sourceMap&-minimize", "autoprefixer-loader?safe=true", "sass?sourceMap"]
},
あなたが推測しているように、私はReactJSとホットリロード機能を使用します。私はどのようにアプリケーションを構造化したいのかは、通常、別のチュートリアルで提供されるよりもはるかにモジュール化されています（各コンポーネントは、同じフォルダに自分のstyle.scssファイルを持つ必要があります）。すべてstyle.scss秒から@import sがどこかに埋もれた
- _base.scss
- _variables.scss
- _components.scss
そして最後に1：だから、フォルダの現在の構造は、次のようなです遠くにある他のフォルダにあります。明らかに、私はすべての変数とミックスインと基本的なもののすべてのインポートを入れます上記のは、いくつかの変数を使用する他のすべてのインポートです。私にとっては明らかにビルドプロセス中に、変数を見つけることができないというエラーメッセージが表示されます。 この場合、Webpacksのsass-loaderは@importのオーダーを定義していますか？そして、スタイルシートのインポートのより明確な構造を作るために私は何をすべきですか？私は一般的に次の2つの目標を達成したいと考えています.1）コンポーネントを独自のスタイルで別々に保ち、2）保守性をあまり苦労させないようにする。
追記： 私はまた、各バンドルに@import秒の新しいリストを作成することができますいくつかのヘルパー関数を考慮しました。このような
find ./src/components -iname '*.scss' | sed 's/.\/src/../g' | awk '{print "@import \""$0"\";"}' >> $NAME
何かを。しかし、それは私の直感によると最高の解決策ではありません:)。