VUE 使用的時候，想要做移動端自適應，而一開始沒有料到用vantUI框架，所以在utils.js中，由於引用了px2rem-loader和lib-flexible，所以要設置：
const px2remLoader = {
loader：'px2rem-loader',
options:{
remUnit:75
}
}
但是后期，發現自己要用vantUI框架，而當我引入之后，發現所有的組件樣式都比樣例要小，一開始很是懵逼··· 后來查詢之后發現，原來是因為vantUI的根字體默認大小是37.5，和我們默認設置的75不一樣，正好是2倍關系，所以當我們的設計圖是750的時候，我們的組件就會看起來是1/2的大小，解決這種問題有三種方法：
1、自己提前預估自己要用vant，所以設置為37.5，並在測量自己的設計圖時，自動計算為1/2來布局，這種顯然是個很雞肋的辦法，簡言之：可以但沒必要！
2、不用px2rem-loader和lib-flexible搭配，而是使用：lib-flexible和postcss-pxtorem搭配，因為lib-flexible和postcss-pxtorem里面有一個過濾功能，可以讓我們過濾掉以van開頭的樣式：在引入的postcssrc.js里面設置：
module.exports={
plugins:{
····,
'postcss-pxtorem':{
rootValue:75,
propList:['*'],
selectorBlackList:['van']
}
}
}
3、如果上面的不想用的話，就用下面這個嘍！但是前提，如果已經使用了第二個，就要把那個過濾的設置給注釋或者刪除，否則可能會影響。第三種辦法就是使用判斷條件，依然是在postcssrc.js里面修改：
const AutoPrefixer = require("autoprefixer");
const px2rem = require("postcss-px2rem");
module.exports = ({ file }) => {
let remUnit;
// 判斷條件 請自行調整 我使用的是 mand-mobile ui 沒有對vant引入進行測試
//link https://github.com/youzan/vant/issues/1181
if (file && file.dirname && file.dirname.indexOf("vant") > -1) {
remUnit = 37.5;
}else {
remUnit = 75;
}
return {
plugins: [
px2rem({ remUnit: remUnit}),
AutoPrefixer({ browsers: ["last 20 versions", "android >= 4.0"] })
]
};
};
以上就是目前我所知道的解決方法，希望對自己有所幫助！最后依然是我們最萌最帥最有型的DK鎮樓！
