Vue移动端适配之rem

一.安装插件

npm add lib-flexible postcss-px2rem

二.在public中的index.html中删除meta标签

删除


   

三.在main.js中导入插件包

 import 'lib-flexible'

四.配置vue.config.js

    module.exports={
  css:{
    loaderOptions:{
      css:{},
      postcss:{
        plugins:[
          require('postcss-px2rem')({
            //适配375屏幕,设计图750中量出来的尺寸要/2
            //配置成37.5是为了兼容没有适配rem布局的第三方ui库
            remUnit:37.5
          })
        ]
      }
    }
  }
}

你可能感兴趣的:(vue)