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

Question

我写了个全局的样式变量

然后在main.js中引入

在组件中使用这些变量

然后就报错了

请问该怎么解决

Answer 1

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

Answer 2

在组件中引入样式看看

Answer 3

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

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

main.js文件

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

vue文件中

#app {
    color: var (--color);
}

Answer 4

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

Answer 5

找到解决办法了，全局使用变量也可以
地址： https://blog.csdn.net/qq_2786...