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