vue2 使用 移动端适配rem

375 阅读1分钟

作为前端开发肯定会遇到适配各种型号的手机、电脑那这就需要配置rem适配

这里我们用到了两个插件:amfe-flexiblepostcss-px2rem

npm install lib-flexible -S 和 npm install px2rem-loader -S

然后我们在main.js中引入 amfe-flexble

import 'lib-flexible/flexible'

最后在vue.config.js中进行配置

chainWebpack: config => {
    config.module
      .rule('css')
        .test(/\.css$/)
        .oneOf('vue')
        .resourceQuery(/\?vue/)
        .use('px2rem')
          .loader('px2rem-loader')
          .options({
            remUnit: 75
          })
  }