1.引入lib-flexible
npm install lib-flexible -D
在main.js中引入lib-flexible
import ‘lib-flexible/flexible.js‘
lib-flexible会自动在htmlhead中添加meta标签,同时会自动设置html的font-size为屏幕宽度的1/10。
由于每次都需要手动计算rem效率低,且易出错,所以引入postcss-px2rem-exclude
2.使用postcss-px2rem-exclude 将px转成rem
npm install postcss-px2rem-exclude -D
在根目录下创建postcss.config.js文件(设置remUnit,忽略node_modules下的文件)
module.exports = { plugins: { autoprefixer: {}, ‘postcss-px2rem-exclude‘: { remUnit: 32, exclude: /node_modules|folder_name/i } } };