下載npm install lib-flexible --save
在main.js引入import 'lib-flexible'
使用px2rem-loader自動將css中的px轉(zhuǎn)換成rem--npm install px2rem-loader --save-dev
打開build/utils.js文件宣旱,找到exports.cssLoaders方法怜械,在里面添加如下代碼
constpx2remLoader= {
loader:'px2rem-loader',
options:{
remUint:75
}
}
修改generateLoaders方法中的loaders
constloaders=options.usePostCSS? [cssLoader,postcssLoader] : [cssLoader,px2remLoader]
然后重新npm run dev复唤,打開控制臺可以看到代碼中的px已經(jīng)被轉(zhuǎn)成了rem
如果在.vue文件style中的某一行代碼不希望被轉(zhuǎn)成rem够庙,只要在后面寫上注釋 /* no*/就可以了? 例如 p{border:1px solid #0094ff;/* no */}
如果在.vue文件style中的某一行代碼希望被轉(zhuǎn)成適配但是以px顯示世分,只要在后面寫上注釋 /* px */就可以了? 例如 p{border:1px solid #0094ff;/* px */}