vue移动端适配 -- px2rem

vue移动端适配 -- px2rem

安装

npm install px2rem-loader  lib-flexible --save

在main.js中引入

import 'lib-flexible/flexible.js'

 

在build中utils.js找到generateLoaders 方法，添加以下代码

const px2remLoader = {

  loader: 'px2rem-loader',

  options: {

    remUnit:37.5

  }

}

  

  // generate loader string to be used with extract text plugin

  function generateLoaders (loader, loaderOptions) {

  const loaders = options.usePostCSS ? [cssLoader, postcssLoader,px2remLoader] : [cssLoader,px2remLoader]

  if (loader) {

    loaders.push({

      loader: loader + '-loader',

      options: Object.assign({}, loaderOptions, {

        sourceMap: options.sourceMap

      })

    })

  }

重启项目后，px会变成rem