一,搭建react环境
create-react-app dome
二,安装依赖
cnpm i postcss-pxtorem amfe-flexible @craco/craco
三,配置
1,在项目根目录下创建craco.config.js文件
2,把代码复制进去
const pxtorem = require('postcss-pxtorem')
module.exports = {
style: {
postcss: {
mode: 'extends',
loaderOptions: {
postcssOptions: {
ident: 'postcss',
plugins: [[
pxtorem({
rootValue: 75,//根据ui提供的效果图修改 看是1x还是2x
propList: ['*'],
minPixelValue: 3,
exclude: /node_modules/i,
})]],
},
},
},
},
};
3,在index.js文件导入amfe-flexible
import 'amfe-flexible';
4,修改package.json
将scripts中的代码进行替换
"scripts": {
"start": "craco start",
"build": "craco build",
"test": "craco test",
"eject": "react-scripts eject"
},
配置完以上操作就可以开发了