Vue2.0自适应Rem设置 Vue+SCSS（PC端）

一、设置JS：

1.自定义JS文件：

window.onload = function () {
  getRem(1920, 100)
};
window.onresize = function () {
  getRem(1920, 100)
};
function getRem (pWidth, pRem) {
  let html = document.getElementsByTagName('html')[0];
  let oWidth = document.body.clientWidth || document.documentElement.clientWidth;
  html.style.fontSize = oWidth / pWidth * pRem + 'px';
}

2.在main.js中引用

import './assets/js/rem'

二、设置SCSS：

1.加载px2rem-loader依赖包：

      npm install px2rem-loader

2.在build中的utils.js的cssLoaders中添加px2remLoader：

const px2remLoader = {
    loader: 'px2rem-loader',
    options: {
      remUnit: 100
    }
};


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