以下方法为px自动转换rem，顾名思义，配置完成后，不用再关心rem换算等等，只需按照设计稿的px值写入即可，当你保存后PostCSS插件会自动将px转换成所配置的rem值，并且你在浏览控制台观测界面时你会发现你在代码里写的是px单位，在控制台被转换成了rem单位。
- postcss 一种对css编译的工具，本身不会对css一顿操作，它通过插件实现功能。
- 1. 使用
amfe-flexible + postcss-pxtorem包实现px自动转换rem
1.首先下载需要的npm包
npm i amfe-flexible
npm install postcss-pxtorem -D- 该插件不能转换行内样式中的 px，例如 <div style="width: 200px;"></div>
2 对文件进行额外的配置
- 首先在
mian.js引入amfe-flexible
import 'amfe-flexible'
3.在与src文件夹平级区域创建一个为.postcssrc.js的文件
对.postcssrc.js文件进行额外配置
autoprefixer 是一个自动添加浏览器前缀的 PostCss 插件，browsers 用来配置兼容的浏览器版本信息，但是写在这里的话会引起编译器警告。因为 VueCLI 内部已经配置了 autoprefixer 插件。文章来源：https://www.toymoban.com/news/detail-813692.html
module.exports = {
"plugins": {
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*']
}
}
}转载：Vue中使px自动转rem配置（使用第三方包）|| 用js配置+Vscode扩展处理适配问题 - 简书 (jianshu.com)文章来源地址https://www.toymoban.com/news/detail-813692.html
到了这里，关于Vue中使px自动转rem配置 (h5适配问题)的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
