webpack2.0加載postcssloader以及autoprefixer實現(xiàn)自動根據(jù)兼容性的需求給css加私有前綴的功能，給開發(fā)帶來便利，

下面是我的配置信息，親測有效：

1.webpack.config.js的配置：

module: {rules: [
　　　　{test: /\.vue$/,loader: 'vue-loader',options: {// vue-loader options go herepostcss: [require('autoprefixer')({ browsers: ['last 10 Chrome versions', 'last 5 Firefox versions', 'Safari >= 6', 'ie > 8'] })]}},
　　　　{test: /\.js$/,loader: 'babel-loader',exclude: /node_modules/},{test: /\.css$/,loaders:'style-loader!css-loader'},{test: /\.less$/,loader: 'style-loader!css-loader!postcss-loader!less-loader',exclude: /node_modules/},{test: /\.(eot|svg|ttf|woff|woff2)$/,loader: 'file'},{test: /\.(png|jpg|gif|svg)$/,loader: 'file-loader',options: {name: '[name].[ext]?[hash]'}}] }

?

其他配置略。。。

2.package.json的依賴：

npm install autoprefixer postcss-loader --save--dev

或 npm i autoprefixer postcss-loader -D

實現(xiàn)的效果如下：

編譯完成：

給一個我的demo的鏈接：https://github.com/BugsMaster/test.git

轉(zhuǎn)載于:https://www.cnblogs.com/bug-master/p/6489284.html

總結(jié)

以上是生活随笔為你收集整理的webpack加载postcss，以及autoprefixer的loader的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。