安裝插件：
安裝postcss-pxtorem
npm install postcss-pxtorem --save-dev
安裝lib-flexible
由于時間的問題叼旋，lib-flexible其實已經(jīng)棄用了夹攒，現(xiàn)在是使用名為amfe-flexible的插件太闺，amfe-flexible實際上就是在lib-flexible的基礎(chǔ)上更新的，所以用法都是一樣。
npm i -s amfe-flexible
安裝完畢只需要引入amfe-flexible
引入插件：
main.js文件引入：
import 'amfe-flexible'
創(chuàng)建配置文件：
在根目錄鼻由，和package.json同級，創(chuàng)建一個名為postcss.config.js的文件榴芳，然后里面的內(nèi)容我直接照搬vant提供的嗡靡。
如果有這個文件，可以自行修改里面的內(nèi)容窟感，沒有才創(chuàng)建讨彼。
module.exports = {
plugins: {
autoprefixer: {
browsers: ['Android >= 4.0', 'iOS >= 8'],
},
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*'],
},
},
};
然后保存，這個時候我們再去vue里面柿祈，對元素設(shè)置px哈误，運行時會發(fā)現(xiàn)網(wǎng)頁上自動轉(zhuǎn)換成了rem單位。
百度到一個新的配置
module.exports = {
plugins: {
'autoprefixer': {
overrideBrowserslist: [
'Android 4.1',
'iOS 7.1',
'Chrome > 31',
'ff > 31',
'ie >= 8'
]
},
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*']
}
}
}
黑名單
顧名思義躏嚎，在黑名單中的類名蜜自，將不會自動rem轉(zhuǎn)換
module.exports = {
plugins: {
'autoprefixer': {
overrideBrowserslist: [
'Android 4.1',
'iOS 7.1',
'Chrome > 31',
'ff > 31',
'ie >= 8'
]
},
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*'],
selectorBlackList: ['.van-notify',],
}
}
}
