webpack打包使用postcss添加浏览器前缀

在Webpack中使用PostCSS处理CSS并添加浏览器前缀，通常需要以下几个步骤：

1. **安装依赖**：
- 首先，你需要安装PostCSS及其相关的插件，比如autoprefixer，它能自动为你添加合适的浏览器前缀。运行：

     npm install postcss autoprefixer --save-dev

2. **配置Webpack**：
- 在Webpack的配置文件（如webpack.config.js）中，添加PostCSS到loader链中。创建一个postcss对象，并配置 autoprefixer。示例：

     module.exports = {
       module: {
         rules: [
           {
             test: /\.css$/,
             use: ['style-loader', 'css-loader', 'postcss-loader'],
             // 注意这里的"options"对象，它包含autoprefixer的配置
             options: {
               plugins: function () {
                 return [require('autoprefixer')()]
               }
             }
           }
         ]
       }
     };

3. **启用处理器**：
- 在.postcssrc.js或其他配置文件中，指定autoprefixer使用的浏览器选择器范围，例如：

     module.exports = {
       browsers: ['last 2 versions', 'not ie <= 9']
     };

这样，在Webpack打包时，PostCSS会应用autoprefixer来处理CSS并自动添加所需的浏览器前缀。