手機端頁面開發(fā)旷痕，使用vue碳锈，UI框架用vant，設(shè)計稿是750px欺抗，單位用rem
vant是按照375px設(shè)計稿開發(fā)售碳，為單位的，如果配置根字體大小為37.5绞呈，設(shè)計稿就無法還原贸人，配置75，vant組件就變小了佃声。
很是苦惱艺智，經(jīng)過一番搜索，按照如下配置.postcssrc.js文件圾亏，就可以完美解決問題
module.exports?=?({?file?})?=>?{
??let?isVant?=?file?&&?file.dirname?&&?file.dirname.indexOf("vant")?>?-1;
??let?rootValue?=?isVant???37.5?:?75;?//?判斷條件?請自行調(diào)整
??return?{
????plugins:?{
??????autoprefixer:?{
????????overrideBrowserslist:?['Android?4.1',?'iOS?7.1',?'Chrome?>?31',?'ff?>?31',?'ie?>=?8']
??????},
??????"postcss-pxtorem":?{
????????rootValue:?rootValue,?//結(jié)果為：設(shè)計稿元素尺寸/75力惯，設(shè)計稿寬?750,最終頁面會換算成?10rem??????
????????unitPrecision:?5,?//保留小數(shù)位????
????????propList:?["*"],
????????//https://github.com/youzan/vant/issues/1181#issuecomment-487305533
????????//selectorBlackList:?["van-"],?//（數(shù)組）要忽略的選擇器并保留為px。?過濾的類名
????????minPixelValue:?2?//?（數(shù)字）設(shè)置要替換的最小像素值?解決?1px?問題?//所有小于設(shè)置的樣式都不被轉(zhuǎn)換???
??????}
????}
??}
}
參考??//http://www.reibang.com/p/20dad3f93216
