nuxt.js中引入lib-flexible 和 postcss-px2rem 實現pc自適應


最近一個需要用nuxt框架實現的pc自適應項目,從網上找了很多資料,最終完美實現

一、下載相關插件

npm i lib-flexible -S
npm i px2rem-loader -D
npm install postcss-px2rem save

二、在plugins文件下新建 lib-flexible.js文件  引入 lib-flexible

 三、因為是pc端自適應,所以在 node_modules 文件夾下找到 lib-flexible文件中的 flexible.js

 四、在nuxt.config.js 中配置

plugins: [ {src:'@plugins/lib-flexible.js',ssr:false} ],

 build: {
    postcss: [
      require('postcss-px2rem')({
        remUnit: 192  // 之所以寫192是因為設了pc最大寬度1920px
      })
    ],
  }

 好了,大功告成!!!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM