摘要:本文主要介紹在移動端項目中如何使用及其配置使用腳手架生成的項目,后運行彈出配置項,該命令不可逆哦。使用了作為計算依據,因此需要在中貼上以下代碼,并沒有使用淘寶的方案使用的設計圖是的哦配置的按需加載當然了,你需要先。
本文主要介紹在react移動端項目中如何使用antd-mobile2及其配置
使用 create-react-app腳手架生成的項目,后運行npm run eject 彈出配置項,該命令不可逆哦。
1、使用了rem作為計算依據,因此需要在index.html中貼上以下代碼,并沒有使用淘寶的flexible方案
(function (doc, win) { var docEl = doc.documentElement, resizeEvt = "orientationchange" in window ? "orientationchange" : "resize", recalc = function () { var clientWidth = docEl.clientWidth; if (!clientWidth) return; docEl.style.fontSize = 100 * (clientWidth / 750) + "px"; }; if (!doc.addEventListener) return; win.addEventListener(resizeEvt, recalc, false); doc.addEventListener("DOMContentLoaded", recalc, false); })(document, window);
使用的設計圖是750的哦!
2、配置antd-mobile的按需加載
2-1. 當然了,你需要先npm i antd-mobile --save。 2-2.配置按需加載package.json
3、配置webpack
3-1.首先 npm i postcss-px2rem-exclude --save-dev 3-2.config/webpack.config.dev.js和webpack.config.prod.js中首先引入 const px2rem=require("postcss-px2rem-exclude"); 然后就是配置了,直接上圖了
webpack.config.dev.js和webpack.config.prod.js都需要如此配置哦!
4、使用
直接引用需要的組件就可以了
5、關于css的單位問題
750的設計圖,ps上量的尺寸是多少px,在scss文件里寫多少尺寸就行了
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/107886.html
摘要:本文主要介紹在移動端項目中如何使用及其配置使用腳手架生成的項目,后運行彈出配置項,該命令不可逆哦。使用了作為計算依據,因此需要在中貼上以下代碼,并沒有使用淘寶的方案使用的設計圖是的哦配置的按需加載當然了,你需要先。 本文主要介紹在react移動端項目中如何使用antd-mobile2及其配置 使用 create-react-app腳手架生成的項目,后運行npm run eject 彈出...
摘要:坑請求跨域問題使用時,其中的已經默默幫你做了很多事,都幫你配置好了所以你發現你找不到相關的配置文件。放到服務器上仍然是空白的無法訪問。原來是因為路徑問題,簡單配置一下即可。上文提到過已經幫我們做好了很多事,方便在此,麻煩也在此。 react坑: 1、fetch請求cookie跨域問題使用creat-react-app時,其中的react-script已經默默幫你做了很多事,都幫你配置好...
閱讀 1598·2021-11-04 16:11
閱讀 3309·2021-09-09 11:33
閱讀 1558·2019-08-30 15:54
閱讀 619·2019-08-30 15:44
閱讀 3173·2019-08-30 15:43
閱讀 2554·2019-08-30 13:06
閱讀 1698·2019-08-29 17:00
閱讀 895·2019-08-29 15:33