整了半天，還是不能用px2rem-loader這個組件，因為他沒有忽略範圍，要換postcss-plugin-px2rem

1、先npm 安裝postcss-plugin-px2rem插件

npm i postcss-plugin-px2rem  --save -dev

2、找到與src同級目錄下的.postcssrc.js

module.exports = {
  "plugins": {
 "postcss-import": {},
 "postcss-url": {},
 // to edit target browsers: use "browserslist" field in package.json
 "autoprefixer": {}
  }
}

然後重新npm run dev，打開控制枱可以看到代碼中的px已經被轉成了rem

注意：

    1.此方法只能將.vue文件style標籤中的px轉成rem，不能將script標籤和元素style裏面定義的px轉成rem

    2.如果在.vue文件style中的某一行代碼不希望被轉成rem，只要在後面寫上註釋 / no/就可以了

問題：為什麼要 忽略node_modules目錄下的文件？

答：有時候我們在手機端項目的時候需要導入第三方UI庫，例如：VUX,MINT等，這時你就會發現第三方的組件樣式都變小了，變小的主要原因是第三庫 css一依據 data-dpr="1" 時寫死的尺寸，我們使用的flexible引入時 data-dpr不是一個寫死了的，是一個動態的，就導致這個問題。

這裏就不再修改第三方的UI樣式，直接忽略掉，簡單直接實用。