我正在开发一个播客风格的ember应用程序，使用ember-cli-sass和ember-component-css。
我在app/styles/app.scss中定义了一个如下所示的变量：
$yellow: #f2d173;但是，当我尝试在位于以下位置的组件的scss文件中使用该变量时：app/components/login-form/styles.scss，我收到一个错误，内容如下：
Error: Undefined variable.我本来希望app.scss文件首先被加载，并且我的变量在我的组件中是可访问的--但是有些东西并没有完美地工作。
有人知道如何在我的组件中访问应用程序范围的scss/sass变量吗？
1条答案
按热度按时间mgdq6dx11#
可能是一个问题，包括文件（s）/传递var...一些更多的信息，关于您的项目组织将有所帮助...
您如何组织/包含您的模块/文件（
@import或新规则@use）？您的项目的文件/目录结构如何？
如果你用传统的方式处理
@import，那么文件/模块导入主文件的顺序是很重要的。你可以检查：1.如果
@import：在
app/styles/app.scss中设置变量后，.../login-form/styles.scss是否导入到主.scss中？(If您正在使用ember pod样式css文件，您可能正在从
@import "pod-styles";导入您的login-form的样式，请确保您的变量定义在该行之前！）如果你确实使用了新的
@use技术，那就是另一种情况，可能会有点棘手。你可以检查：1.如果
@use：变量被设置的文件（
app/styles/app.scss）@use'd到.../login-form/styles.scss是否需要变量？@use时发出警报：如果模块app/components/login-form/styles.scss本身是@use的，那么当您对它执行@use操作时，是否将变量传递给了模块？由于
@use是一项新功能，因此下面提供了更多有关其工作原理的信息：https://sass-lang.com/documentation/at-rules/use。