react配置px转换rem的方法
更新时间：2021年04月30日 11:39:44 作者：王小红丶
这篇文章主要介绍了react配置px转换rem的方法,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
安装相关的依赖
npm i lib-flexible --save
npm i postcss-px2rem --save
主要用来暴露项目配置
npm run eject
！如果运行npm run eject报错，出错的原因应该是仓库里面代码没有提交，如下提交一下
git add .
git commit -m '自定义名'
npm run eject
然后打开项目中 config->webpack.config.js 进行配置
// 在配置文件中添加如下两行代码
// px2rem({ remUnit: 75 }) 的意思就是1rem = 75px 这个是根据750px设计稿来的，如果是620 的就写 62const px2rem = require('postcss-px2rem');
px2rem({ remUnit: 75 })
按照设计图大小设置 如：108=1080px/10
引入 lib-flexible：在入口文件index.js中引入lib-flexible文件
import 'lib-flexible'
在 public->index.html 文件里把下面的这段代码注释掉
配置完成之后 重启项目
到此这篇关于react配置px转换rem的方法的文章就介绍到这了,更多相关react配置px转换rem内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了React Native集成支付宝支付的实现现,ativeModules是JS代码调用原生模块的桥梁。所以，我们只需要在原生工程中集成支付宝和微信支付的sdk，然后使用NativeModules调用即可，需要的朋友可以参考下2022-02-02
一文搞懂 React 18 中的 useTransition() 与 useDeferredValue()
这篇文章主要介绍了一文搞懂 React 18 中的 useTransition()与useDeferredValue()，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下2022-09-09
这篇文章主要介绍了React中的生命周期和子组件，文章围绕主题展开详细的内容介绍，具有一定的参考价值，感兴趣的小伙伴可以参考一下2022-08-08
这篇文章主要介绍了React优化子组件render的使用,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-05-05
React Hook 'useEffect' is call
这篇文章主要为大家介绍了React Hook 'useEffect' is called in function报错解决，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-12-12
本文讲述了开发React应用时如何使用shouldComponentUpdate生命周期函数以及PureComponent去避免类组件进行无用的重渲染，以及如何使用最新的React.memo API去优化函数组件的性能2019-03-03
本文通过实例给大家分享了编写React组件项目实践的全过程，对此有兴趣的朋友可以参考下。2018-03-03
下面小编就为大家带来一篇react native实现往服务器上传网络图片的实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
这篇文章主要介绍了React使用公共文件夹public问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-12-12
react setupProxy.js导致项目无法启动的解决
这篇文章主要介绍了react setupProxy.js导致项目无法启动的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-07-07
最新评论