vue cli3

1:px2rem 使用方式
  npm i postcss-pxtorem --save-dev


  创建一个rem.js  src/assets  内容如下
// 基准大小
const baseSize = 32
    // 设置 rem 函数
function setRem() {
    // 当前页面宽度相对于 750 宽的缩放比例，可根据自己需要修改。
    const scale = document.documentElement.clientWidth / 750
        // 设置页面根节点字体大小
    document.documentElement.style.fontSize = baseSize * Math.min(scale, 2) + 'px'
}
// 初始化
setRem()
    // 改变窗口大小时重新设置 rem
window.onresize = function() {
    setRem()
}


在main.js 引入刚才的脚本


项目根目录新建一个vue.config.js 添加内容

module.exports = {

lintOnSave: true,

css: {

loaderOptions: {

postcss: {

plugins: [

require('postcss-pxtorem')({

rootValue: 32,

remUnit: 32,

propList: ['*'],

selectorBlackList: ['vux-']

})

]

}

}

}

}

　　

1；安装vue cli3/ 创建项目

npm install -g @vue/cli
vue create my-project

2：根目录新建 vue.config.js

　　

转载于:https://www.cnblogs.com/lgjc/p/10825648.html