vue在main.js引入sass,在组件中使用变量报错

我写了个全局的样式变量
clipboard.png

然后在main.js中引入
clipboard.png

在组件中使用这些变量

clipboard.png

然后就报错了

clipboard.png

请问该怎么解决

阅读 8.9k
5 个回答

sass的变量,只能组件需要的时候,以import的方式引入。
main.js中引入的sass文件,可以作为全局样式全局变量,在webpack看来,是无法识别的。

在组件中引入样式看看

如果兼容性要求不是很高,可以考虑使用css变量(sass中可以使用),用法如下:
css文件

@charset "UTF-8";
:root {
    --color: red;
}

main.js文件

reqiure('XXX/XXX/var.css')

vue文件中

#app {
    color: var (--color);
}
新手上路,请多包涵

你的@在sass里面是无法使用的,获取不到相应的路径,你换成相对路径试试看

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题