postCss+vw的vue移動端配置

1.沒有postCss則先安裝postcss

原文鏈接https://segmentfault.com/a/1190000017708891

2.文件目錄創建postcss.config.js文件

3.在postcss.config.js里添加如下代碼

module.exports = {
  'plugins': {
    "postcss-px-to-viewport": {
      viewportWidth: 750, // 設計稿寬度
      viewportHeight: 1334, // 設計稿高度，可以不指定
      unitPrecision: 3, // px to vw無法整除時，保留幾位小數
      viewportUnit: 'vw', // 轉換成vw單位
      selectorBlackList: ['.ignore', '.hairlines'], // 不轉換的類名
      minPixelValue: 1, // 小於1px不轉換
      mediaQuery: false, // 允許媒體查詢中轉換
      exclude: /(\/|\\)(node_modules)(\/|\\)/ //不轉換我們引入的第三方包
    },
    // to edit target browsers: use "browserslist" field in package.json
    'autoprefixer': {}
  }
}