webpack之css自动转rem(px2rem-loader)

主要是使用 px2rem-loader 插件配合lib-flexible来实现

1、安装px2rem-loader

npm i px2rem-loader -D

2、配置px2rem-loader

                    {
                        loader: 'px2rem-loader',
                        options: {
                            remUnit: 75,
                            remPrecision: 8
                        }
                    }

其中remUnit为1rem=75px，remPrecision为转化后小数点后位数

3、安装lib-flexible

npm i lib-flexible -S

4、将lib-flexible内联如项目头部，保证他最快执行

5、如果有css不希望被转化单位则可使用以下方法/*no*/标签

.page {
  font-size: 12px; /*no*/
  width: 375px; /*no*/
  height: 40px; 
}