在main.js中添加:
// 设定body文字尺寸
const setHtmlFontSize = () => {
// 640 默认设计稿大小; 640px = 6.4rem ;每个元素px基础上/100
const htmlWidth = document.documentElement.clientWidth || document.body.clientWidth;
// 得到html的Dom元素
const htmlDom = document.getElementsByTagName('html')[0];
// 设置根元素字体大小
htmlDom.style.fontSize = htmlWidth / 96 + 'px';
console.log('dd');
console.log(htmlDom.style.fontSize );
};
window.onresize = setHtmlFontSize;
setHtmlFontSize();
npm i lib-flexible -S
npm i postcss-px2rem -S
mport 'lib-flexible'
修改 lib-flexible.js
vue.config.js文件如下:
const px2rem = require('postcss-px2rem');
module.exports = {
css: {
loaderOptions: {
css: {},
postcss: {
plugins: [
px2rem({
remUnit: 37.5,
}),
],
},
},
},
publicPath: process.env.NODE_ENV === 'production'
? '/vue-mall-app/'
: '/',
};