javascript - 在Webpack 2.x中将自动前缀与postcss一起使用

如何在Webpack 2.x中使用autoprefixer。

以前，以前是这样的...

...

module: {
  loaders: [
     {
       test: /\.scss$/,
        loader: 'style!css!sass!postcss'
     }
   ]
},
postcss: () => {
  return [autoprefixer]
},

...

但是，它不再起作用了。

如何将其重写为[email protected]？

最佳答案

不再需要使用LoaderOptionsPlugin。现在，您可以将选项直接传递给加载程序声明。

const autoprefixer = require('autoprefixer');

let settings = {
    /*...*/
    module: {
        rules: [{
            test: /\.css$/,
            use: [
                /*...other loaders...*/
                {
                    loader: 'postcss-loader',
                    options: {
                        plugins: function () {
                            return [autoprefixer]
                        }
                    }
                }
                /*...other loaders...*/
            ]
        }]}
    }
    /*...*/
};

如果需要提供特定的兼容性配置，可以将其作为参数传递给autoprefixer函数:

options: {
    plugins: function () {
        return [autoprefixer('last 2 versions', 'ie 10')]
    }
}

关于javascript - 在Webpack 2.x中将自动前缀与postcss一起使用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40761473/