webpack升级到5发现原先的 xx.scss 导出变量不能用了
返回一个空对象，心中万马奔腾
import $style from '@/xxx/exportVariable.scss'
console.log( $style ) // {}
解决方法：
1、使用xx.module.scss 【推荐】
把原先的xx.scss 改成 xx.module.scss 就可以了
import $style from '@/xxx/exportVariable.module.scss'
console.log( $style ) // {colorPrimary: '#ff901b',....}
2、配置webpack启用modules
大多数情况下我们推荐使用第一种方式，但是有引用第三方的一些库，如果没启用可以导致样式渲染异常
// vue.config.js
css: {
modules: {
auto: resourcePath => {
return resourcePath.endsWith('xxx.scss')
}
}
}
网友评论