vue2 webpack2 為less/css自動添加前綴autoprefixer

為了兼容不同的瀏覽器，很多時候要寫前綴，不然存在很多兼容性問題，如果用webpack的話，很容易實現自動添加前綴，我現在用的項目是基於vue2 webpakc2的，查閱了很久沒有發現便捷的解決方案：

1. 安裝 postcss-loader

npm install postcss-loader --save-dev

2.配置webpack.conf.js

 rules: [{
            test: /\.vue$/,
            loader: 'vue-loader',
            options: {
                // vue-loader options go here
                postcss: [require('autoprefixer')({ browsers: ['last 10 Chrome versions', 'last 5 Firefox versions', 'Safari >= 6', 'ie > 8'] })]
            }
        }, 
{
            test: /\.less$/,
            loader: 'style-loader!css-loader!postcss-loader!less-loader'
        }]

一行代碼即可實現css前綴添加,很是方便

vue-loader