首先下載：
npm install px2rem-loader --save
npm install amfe-flexible --save
main.js引入：
import Vue from 'vue'
import App from './App'
import router from './router'
// rem h5 適配
import 'amfe-flexible/index.js'
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
build文件夾下的utils.js:
exports.cssLoaders 中添加：
const px2remLoader = {
loader: 'px2rem-loader',
options: {
remUnit: 75
}
}
const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
改為：
const loaders = options.usePostCSS ? [cssLoader, postcssLoader,px2remLoader] : [cssLoader,px2remLoader]
關(guān)于1px轉(zhuǎn)化問(wèn)題： 1px轉(zhuǎn)化rem后有些手機(jī)上顯示模糊或不顯示糯崎，解決辦法：將px大寫(xiě)，即1px寫(xiě)為1PX
