7.webpack 自动清理目录构建产物 、css前缀和px转rem

1. 我们在每一次打包都会生产新的文件，如果之前的没有删除，那么就会越来越多，使用clean-webpack-plugin可以做到构建前先自动清理

   1. 　安装 npm i clean-webpack-plugin 然后添加在plugins
   2.  

2. css中px单位转rem,适配更多手机，在没有rem之前，为了适配各种移动端使用的是媒体查询

   1. 
   2. 

   3. 安装  npm i postcss-loader autoprefixer -D      以及手淘的一个动态计算rem单位的解决方案     npm i lib-flexible -S

   4.  

   5. 这时候就已经自动转成rem了，但是想要自动调节，需要在html文件引入lib-flexible。

   6. 需要在html文件设定script标签，再把这个文件内容复制进去，标签记得前置　　

3. 自动生成css3前缀

1.  

2.  安装    npm i postcss-loader autoprefixer -D

3.  配置

4. 

5. {
                   test:/.less$/,
                   use:[
                       MiniCssExtractPlugin.loader,  //要在css前面
                       'css-loader',  //要在less前面
                       'less-loader',
                       {
                          loader:'postcss-loader',
                          options:{
                              plugins:()=>[
                               //    require('autoprefixer')({
                               //        browser:['last 2 version','>1%','ios']
                               //    })  //旧版本会报错
                               require("autoprefixer")({
                                   overrideBrowserslist: ['> 0.15% in CN']
                                 })
                               ]
                          }     
                       }
                   ]
               }