0

webpack を使用して scss ファイルを読み込む際に問題が発生しています。

次のエラーが表示されます。

Module build failed: 
@import 'bulma';
^
      Invalid CSS after "...load the styles": expected 1 selector or at-rule, was "content = requi..."

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

module.exports = {
  entry: "./app/App.js",
  output: {
    filename: "public/bundle.js"
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel',
        query: {
          presets: ['react', 'es2015']
        }
      },
      {
        test: /\.scss$/,
        loaders: ['css', 'sass', 'style']
      }
    ]
  }
};

これは main.scss です:

@import 'bulma';

body {
  background-color: red;
}

そして、次のように App.js エントリ ポイントにファイルをインポートします。

import './stylesheets/main.scss';

任意のヒント？

4

1 に答える 1

4

ローダーの順序が間違っています。ローダーは右から左に読み取られます。SCSS を CSS に解析し、次に CSS を Javascript に解析し、解析した CSS をスタイル タグとしてロードする必要があるため、次のようにします。

        loaders: ['style', 'css', 'sass']
于 2016-04-11T20:47:58.150 に答える