Question

我无法得到autoprefixer-loader 1.10来为我的scss / css添加前缀（显然1.20已经坏了）。添加加载程序后，它不再正确编译mixins。当我删除错误的mixins时，它会编译，但不会添加前缀。这是来自终端的Webpack的编译细节，以及我的模块结构。任何帮助将不胜感激。

https://gist.github.com/zachshallbetter/efafbffa7e08bcc0aab4

  module: {
    loaders: [{
      test: /\.jsx?$/,
      loaders: ['react-hot', 'babel'],
      include: path.join(__dirname, 'app/scripts')
    },
    {
      test: /\.scss$|\.css$/,
      loader: 'style-loader!css-loader!sass-loader'
    },
    {
      test: /\.jpe?g$|\.gif$|\.png$|\.svg$|\.woff$|\.ttf$|\.wav$|\.mp3$/,
      loader: "file"
    },
    {
      test: /\.json$/,
      loader: "raw-loader"
    }]
  }

Answer 1

由于autoprefixer-loader已被弃用，他们鼓励我们使用postcss（https://github.com/postcss/postcss-loader），我使这个配置也正常工作：

test: /\.scss/, loader: 'style-loader!css-loader!postcss-loader!sass-loader'

Answer 2

我有同样的问题。对我来说，问题是我在autoprefixer-loader之前加入了sass-loader。 autoprefixer-loader需要首先转换css，然后转换为sass。

查看您的日志（例如第83行），我可以看到您的情况确实如此。从以下位置更改webpack.config中的以下内容：

loader: 'style-loader!css-loader!sass-loader'

为：

loader: 'style-loader!css-loader!autoprefixer-loader!sass-loader'

应该做的伎俩。我希望有效！

Autoprefix loader在Webpack中打破了scss编译

2 个答案: