Autoprefix加载程序打破Webpack中的scss编译

我无法获得autoprefixer-loader 1.10以我的scss/css为前缀（显然1.20已损坏）。加载加载器后，它不再适当地编译mixin。当我删除错误的mixin时，它会编译，但不会加前缀。这里是来自终端的Webpack的编译细节，以及我的模块结构。任何帮助，将不胜感激。Autoprefix加载程序打破Webpack中的scss编译

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" 
    }] 
    }

来源

2015-05-09 Zach Shallbetter

[一些用户（https://github.com/ passy/autoprefixer-loader/issues/17＃issuecomment-78096700）报道，sass-loader的新版本已经为他工作。如果你无法得到这个工作，也许最好直接通过autoprefixer-loader问题跟踪器。 –

由于autoprefixer装载机已被弃用，他们鼓励我们使用postcss代替（https://github.com/postcss/postcss-loader），我做了这个配置，它也工作：

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

来源

2016-03-08 18:07:44 dHakelila

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

看着你的日志（例如第83行），我可以看到你的情况确实如此。

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

到：从您webpack.config更改以下

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

应该做的伎俩。我希望那些作品！

来源

2015-12-07 04:57:48

我的印象是这些装载机从右到左运行。 – krry

“当链接装载机时，它们被应用到左侧（从文件返回）。” - 来自[装载器上的Webpack文档]（https://webpack.github.io/docs/loaders.html） – krry

krry，你是绝对正确的，会修改答案。 –

Autoprefix加载程序打破Webpack中的scss编译

回答

相关问题