這篇“vue如何利用postcss-pxtorem進行移動端適配”文章,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們一定要參考一下,對于“vue如何利用postcss-pxtorem進行移動端適配”,小編整理了以下知識點,請大家跟著小編的步伐一步一步的慢慢理解,接下來就讓我們進入主題吧。
Vue是一款友好的、多用途且高性能的JavaScript框架,使用vue可以創建可維護性和可測試性更強的代碼庫,Vue允許可以將一個網頁分割成可復用的組件,每個組件都包含屬于自己的HTML、CSS、JavaScript,以用來渲染網頁中相應的地方,所以越來越多的前端開發者使用vue。
注意事項:
1.個人建議在進行postcss-pxtorem適配的時候利用webpack進行項目配置,而不要用webpack-simple,因為webpack里面很多插件加載器之類的都是給你預配好的,這樣在項目構建中就不會遺漏什么。
2.cnpm install postcss-pxtorem -D安裝postcss-pxtorem,此插件如果你用的是webpack的話只要進行安裝即可,不需要另外進行配置,此插件是對px進行轉換。
3.新建一個rem.js的文件,輸入以下代碼即可,然后在main.js中引用。
4.在項目的根目錄下找到.postcssrc.js文件在文件內添加以下代碼,一般750px的設計稿的根元素大小設置32.
5.重啟項目就ok了
以上是“vue如何利用postcss-pxtorem進行移動端適配”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。