webpack通过postcss-loader添加浏览器前缀

首先webpack.config.js中加载loader

module.exports = {
    //    __dirname是nodejs里的一个全局变量,他指向我们的根目录
    //entry入口文件路径
    entry: __dirname + '/app/main.js',
    //出口文件位置
    output: {
        path: __dirname + '/public', //出口文件位置
        filename: 'webpack.js' //出口文件名
    },
    module: {
        loaders: [
            {
                test: /\.css$/,
                loader: "style-loader!css-loader!postcss-loader"
            }
        ]
    }
}

我们这里使用了postcss-loader,但是他需要依赖项,直接在下方require并没有卵用,这里采纳网友的做法,亲测可用,就分享一下

主要是重置了postcss.config.js的配置项

我们在webpack.config.js的同级目录下新建postcss.config.js文件,配置如下

module.exports = {
  plugins: [
    require('autoprefixer')
  ]
}

截下来我们在来运行webpack就可以了,我们右击审查元素,发现css3属性已经给加上了浏览器前缀,但是貌似没有-moz-