如何使用单个@import将宝石中的SCSS变量公开到Rails项目中

Question

我有一个Rails项目和一个宝石。 rails项目具有.scss文件，这些文件需要gem中的变量：

Rails项目

application.scss：

@import "gem-styles.scss";  
@import "my-scss-file-that-needs-access-to-variables.scss"

我-SCSS文件 - 即，需要接入到variables.scss：

color: $primary-color;

宝石

在gem-styles.scss中：

@import "common/variables";

在common / _variables.scss中：

$primary-color: #00d9ff;

这样做，我得到错误： Undefined variable: "$primary-color".

我可以在my-scss-file-that-needs-access-to-variables.scss包含common/variables my-scss-file-that-needs-access-to-variables.scss来解决此问题：

@import "common/variables";

但我发现该解决方案不够干燥。 我将必须将common/variables导入每个需要它们的.scss文件中。 我希望只能从gem导入一个.scss文件，该文件包含我需要在父应用程序中公开的所有变量以及gem-styles.scss的其余样式。

Answer 1

您可以只将此@import "common/variables";粘贴@import "common/variables"; 进入您的application.scss仅一次。

@import "common/variables";
@import "gem-styles.scss";  
@import "my-scss-file-that-needs-access-to-variables.scss"

像这样