首页 > 移动平台 > 详细

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

时间:2020-03-12 12:21:30      阅读:133      评论:0      收藏:0      [点我收藏+]

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

原文:https://www.cnblogs.com/hzz-/p/12467979.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!