react 配置 rem（px转rem适配手机端）

1、 计算 js

在index.html中添加以下js

2、配置webpack.config.js

由于react默认隐藏webpack配置需要手动显示。首先执行命令显示webpack配置

npm run eject
//Are you sure you want to eject? This action is permanent. (y/N) 
y
安装以下包：lib-flexible sass-loader node-sass postcss-px2rem-exclude

npm i lib-flexible sass-loader node-sass postcss-px2rem-exclude --save

修改webpack.config.js ，首先引入：

const px2rem = require('postcss-px2rem-exclude');
//加入
 px2rem({remUnit:75,exclude: /node_modules/i})

然后找到处理postcss-loader的地方：

image.png

在我们的入口文件index.js 中引入lib-flexible

import "lib-flexible"

最后一步修改index.html