Rails4 资产预编译失败答案

【问题标题】：Rails4 asset precompiling failsRails4 资产预编译失败
【发布时间】：2015-06-10 21:18:15
【问题描述】：

在我的应用程序中，我有各种主题可供用户选择用于特定网页。这些主题仅在颜色和字体类型方面有所不同。因此，为了不重复 css 声明，我创建了一个包含常见 css 声明 ztheme.css.scss 的 scss 文件，其中包含所有主题中的常见 css 样式。而且我有各种主题 scss 文件（例如silver.css.scss、melon.css.scss - 如下所示），仅针对颜色和字体类型定义了变量值。在所有这些主题 scss 文件中，您可以在底部看到它将常见的ztheme.css.scss 导入为@import 'ztheme'。因此，当这些主题文件被编译时，它们将具有具有适当颜色和字体类型值的通用 css 样式。

silver.css.scss

$nav_bg_color: #F6F6F6;
$page_font: 'Sintony', sans-serif;
$page_txt_color: #000033;
@import 'ztheme';

melon.css.scss

$nav_bg_color: #F2F6C6;
$page_font: 'Arial', verdana;
$page_txt_color: #628002;
@import 'ztheme';

ztheme.css.scss

body{
  padding-bottom: 20px;
  background: $nav_bg_color;
  font-family: $page_font;
  text-rendering: optimizelegibility;
  color: $page_txt_color;
}

问题是，当我在 heroku 上部署此代码时，资产预编译开始，然后它在 ztheme.css.scss 中失败，因为它会查找其中定义的变量的值。并抛出这个错误：

remote:        rake aborted!
remote:        Sass::SyntaxError: Undefined variable: "$nav_bg_color".
remote:        /tmp/build_ded002611a0752bd96038a671fd8051c/app/assets/stylesheets/themes/ztheme.css.scss:9

但是你可以看到，ztheme 被导入到每个主题文件中，所以当ztheme 将被导入到这些文件中时，这些 zthemes 的值应该被正确填充并且它不应该抛出 Undefined variable 错误。

如何解决这个问题？

我的资产结构如下：

【问题讨论】：

标签： ruby-on-rails ruby-on-rails-4 heroku asset-pipeline

【解决方案1】：

很难从您的代码中确定哪些代码在哪个文件中，但我认为您可能已经向后完成了 @imports。尝试将所有主题导入“ztheme.css.scss”，因为它们是您定义“$nav-bg-color”的地方。

这可能不是一个包罗万象的解决方案，但可以从某个地方开始。

我希望这在某种程度上有所帮助。

【讨论】：

【解决方案2】：

经过多次尝试，终于找到了解决方案。我必须在ztheme.css.scss 中为这些变量添加一个default 值，该值在特定于主题的 scss 中被覆盖

$nav_bg_color: #F1C5CE  !default;
$page_font: Arial, Verdana !default;
$page_txt_color: #459823 !default;

body{
  padding-bottom: 20px;
  background: $nav_bg_color;
  font-family: $page_font;
  text-rendering: optimizelegibility;
  color: $page_txt_color;
}

【讨论】：