转 web 时 `scss` 通过 additionalData 引入的全局变量 px 不会被转化为 vw 或 rem
soulmate126 opened this issue · comments
Riley Rogers commented
转web时通过 css.loaderOptions.scss.additionalData
引入全局变量
// vue.config.js
module.exports = defineConfig({
css: {
// sourceMap: true,
loaderOptions: {
scss: {
additionalData: '@import "@/styles/var.scss";'
}
}
}
})
// styles/var.scss
$--fs-xs: 14px;
<!-- ./src/pages/index.mpx -->
<style lang="scss">
.list{
font-size: $--fs-xs;
}
</style>
应改转化为对应的 vw
单位
yandadaFreedom commented
样式单位转换需要给 @mpxjs/webpack-plugin 插件配置 transRpxRules 转换规则,输出小程序可以将 px 转成 rpx,输出 web可以将 px 转成 vw, 具体配置可参考 https://mpxjs.cn/api/compile.html#transrpxrules