新的vue-cli脚手架相对于上一版本已经精简了很多，将很多的配置文件给隐藏了起来，因此很多的配置都需要在自定义配置文件vue.config.js中进行，而本文则是将px2rem配置到postcss.config.js中。
1 安装lib-flexible
通过yarn或npm都可以
npm i lib-flexible --save
//在入口文件main.js中进行引入
import 'lib-flexible/flexible.js'
2 安装px2rem
npm i postcss-px2rem -D
//在postcss.config.js中进行配置
module.exports = {
plugins: {
autoprefixer: {},
"postcss-px2rem": {
remUnit: 37.5 //转换为rem的基准px
//其他配置选项自行查文档
}
}
}
但是因为lib-flexible是动态添加dpr的，因此许多第三方ui库会产生错乱，因此推荐使用postcss-px2rem-exclude，它可以忽略不进行转换的文件
···
//配置如下
module.exports = {
plugins: {
autoprefixer: {},
"postcss-px2rem-exclude": {
remUnit: 37.5,
exclude: /node_modules|folder_name/i
}
}
}
···
