react配置px轉換rem的方法

Posted on by

安裝相關的依賴

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 的就寫 62

const 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內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet！

推薦閱讀：