Question

我正在使用 bourbon 和整洁宝石来创建rails应用程序的设计。我的application.css.scss包含这个：

 @import "bourbon";
 @import "neat";
 @import "main";

但如果我运行'rake assets：precompile'，则会发生此错误：

rake aborted!
Undefined mixin 'outer-container'.
(in /Users/anonymous/example/app/assets/stylesheets/admin/main.css.scss)
/Users/anonymous/example/app/assets/stylesheets/admin/main.css.scss:5:in  `outer-container'
/Users/anonymous/example/app/assets/stylesheets/admin/main.css.scss:5

main.css.scss文件包含：

footer#page_footer { 
 @include outer-container;
 nav{
  @include span-columns(6);
  @include shift(3);
  section#about_me_footer, section#contact_footer, section#miscellaneous_footer {
  @include span-columns(2 of 6);
 }
}
p {
 @include span-columns(6);
 @include shift(3);
}
}

有人可以给我一些建议吗？

Answer 1

我遇到了同样的问题。我能够以两种不同的方式使它工作。

第一种方式可能不太理想，但您可以在application.css.scss文件中添加代码：

div.container {
  @include outer-container;
}

或者，您可以添加：

@import "bourbon";
@import "neat";

到main.css.scss文件的顶部。
这样可以让你的风格井然有序。

波本威士忌网站链接到他们的wiki中有关此问题的页面，但提到的解决方案对我不起作用：

https://github.com/thoughtbot/bourbon/wiki/Rails-Help-%5C-Undefined-mixin

Answer 2

我有同样的问题。我的解决方案是将部分文件从layout.css.scss重命名为_layout.css.scss。在加载mixins之后，需要包含任何使用SASS mixins的文件。在这种情况下，它试图单独预编译layout.css文件，尽管它不需要它引用的mixin的源代码。添加下划线使预编译器忽略该文件，直到另一个文件需要它为止。

Answer 3

根据Change Log <dependency> <groupId>org.hibernate</groupId> <artifactId>hibernate-core</artifactId> <version>5.2.9.Final</version> </dependency> mixin已从版本2.0.0中删除。您可以使用outer-container的最高版本是1.8.0。通过Bundler添加Neat时，除非在Gemfile中指定版本，否则将获得2.0或更高版本。

要做到这一点的new way看起来要简单得多，但如果你有一堆不受支持的scss，那就不那么舒服了。

Answer 4

FWIW这是报告的问题https://github.com/thoughtbot/bourbon/issues/120，使用jacklin关于将import语句直接添加到我的主css文件的注释解决了它。但是，我想修复此问题，因为我真的不想继续将这些import语句添加到我希望使用mixins的每个文件中

Answer 5

我遇到了同样的问题。

我有一个使用@include外部容器的div，另一个包含@include span-columns（8）的div。第二个div错误地位于第一个div之外，产生误导性错误“Undefined mixin'external-container'”。将第二个div移到第一个内部（在外部容器内 - 在CSS和HTML中）纠正了问题。

对于上述问题，您必须通过确保p标记是页脚的子项来执行相同的操作。

未定义的混合物与波旁威士忌和纯净的宝石

5 个答案: