开发多年,下面这个设置我一直用的100%。PC端px+%计算,基本没问题。但是领导和客户就钟爱125%的设置,真的让我醉了。
赶紧想办法吧。
image.png

1.首先考虑rem。
2.安装插件。

npm install amfe-flexible@2.2.1 -S
npm install postcss-pxtorem@5.1.1 -D // 版本到6,会报错

amfe-flexible:是配置可伸缩布局方案
postcss-pxtorem:一款 postcss 插件,用于将单位转化为 rem.
3.main.js引入

import 'amfe-flexible'

4.项目根目录新建postcss.config.js

module.exports = {
  plugins: {
    'postcss-pxtorem': {
      rootValue: 192, 
      // 如果是二倍图750px,则rootValue写 75,如果是一倍图375px,则写 37.5
      propList: ['*'],
    }
  }
}

本地开发已测试:OK。
build已测试:OK。


请鹅出战
328 声望3 粉丝

当我带上墨镜,也许我就真的瞎了。