法一:webpack配置
config.module
.rule('svg')
.exclude.add(resolve('src/icons'))
.end()
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(resolve('src/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end()
// set preserveWhitespace
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
options.compilerOptions.preserveWhitespace = true
return options
})
.end()
config.module
.rule('scss')
.oneOf('vue')
.use('px2rem-loader')
.loader('px2rem-loader')
.before('postcss-loader') // this makes it work.
.options({ remUnit: 36, remPrecision: 8 })
.end()
法二:vue的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 / 6.4 + 'px';
};
window.onresize = setHtmlFontSize;
setHtmlFontSize();
————————————————
版權聲明:本文為CSDN博主「xyphf_和派孔明」的原創(chuàng)文章,遵循CC 4.0 BY-SA版權協(xié)議,轉載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/xyphf/article/details/107934292