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
        }
    }
};