先安装依赖 amfe-flexible 、、postcss-px2rem
然后main.js引入
然后vue.config.js配置一下,自己创建文件
module.exports={
lintOnSave:false,//关闭eslint语法检测
devServer:{
open:true//项目运行后打开浏览器
},
css: {
// 是否使用css分离插件 ExtractTextPlugin
// extract: true,
// 开启 CSS source maps?
sourceMap: false,
// css预设器配置项
loaderOptions: {
postcss: {
plugins: [
require('postcss-px2rem')({ //配置项,详见官方文档
remUnit: 192 // 换算的基数
})
]
}
},
// 启用 CSS modules for all css / pre-processor files.
modules: false
}
}
配置好后,写px会自动转换为rem