vue-cli3.0移动端适配方案lib-flexible

1.引入lib-flexible 

npm install lib-flexible  -D

在main.js中引入lib-flexible

import 'lib-flexible/flexible.js'

lib-flexible会自动在htmlhead中添加meta标签，同时会自动设置html的font-size为屏幕宽度的1/10。

由于每次都需要手动计算rem效率低，且易出错，所以引入postcss-px2rem-exclude

 

2.使用postcss-px2rem-exclude 将px转成rem

npm install postcss-px2rem-exclude  -D

　　

在根目录下创建postcss.config.js文件（设置remUnit,忽略node_modules下的文件）

module.exports = {
    plugins: {
        autoprefixer: {},
        'postcss-px2rem-exclude': {
            remUnit: 32,
            exclude: /node_modules|folder_name/i
        }
    }
};