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

  

  

 

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

上一篇:Android开发进阶 -- 通用适配器 CommonAdapter


下一篇:delphi7:Application.ProcessMessages的作用