vue-cli3用vant框架rem适配方案

1.在node安装插件

npm install lib-flexible postcss-pxtorem --save  

2.在main.js 文件中引入 import ‘lib-flexible/flexible.js’,

//main.js
import 'lib-flexible/flexible.js'

3.在package.json文件中引入; 或者在vue.config.js 中配置;

//package.json
"postcss": {
    "plugins": {
      "autoprefixer": {
        "browsers": [
          "Android >= 4.0",
          "iOS >= 7"
        ]
      },
      "postcss-pxtorem": {
        "rootValue": 37.5,
        "propList": [
          "*"
        ]
      }
    }
  },
//vue.config.js
const autoprefixer = require('autoprefixer')
const pxtorem = require('postcss-pxtorem')

module.exports = {
  css: {
    loaderOptions: {
      postcss: {
        plugins: [
          autoprefixer({
            browsers: ['Android >= 4.0', 'iOS >= 7']
          }),
          pxtorem({
            rootValue: 37.5,
            propList: ['*'],
          })
        ]
      }
    }
  }
}

你可能感兴趣的:(vue-js)