IOS美区账号微信: springsunshine2017

前端技术 · 2021年9月6日 0

create-react-app使用postcss-px2rem

大前提:
1、我使用的是create-react-app创建的应用
2、我不想使用npm run enject暴露配置项
3、我想使用flexible+postcss-px2rem实现移动端的高清适配

实现:
1、解决配置文件的问题:参考https://www.cnblogs.com/diantao/p/13354991.html
通过安装 react-app-rewired customize-cra 然后修改package.js 创建在package.js同级目录下创建config-overrides.js并配置即可,这个环节同时还可以配置路径别名 @ ;
2、postcss-px2rem 并配置即可
完整的配置文件:

const { override, addWebpackAlias ,addPostcssPlugins} = require(“customize-cra”);
const path = require(“path”);
module.exports = override(  
// add an alias for “@” imports  
addWebpackAlias({    [“@”]: path.resolve(__dirname, “src/”),  }),  
addPostcssPlugins([require(“postcss-px2rem”)({ remUnit: 37.5 })])
);

以上就是create-react-app使用postcss-px2rem的内容 开发时间紧张简单记录一下。