BourbonとNeatの宝石との未定義mixin

Question

私はバーボンとneat宝石を使用して、レールアプリケーションのデザインを作成しています。私application.css.scssは、この含まれています

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

しかし、私は 'すくい資産：プリコンパイル' を実行する場合：

は

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

私は同じ問題を抱えていました。私はそれを2つの異なる方法で働かせることができました。

最初の方法は、おそらくあまり望ましくないが、あなたは右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

FWIW、これはおよそjacklinさんのコメントを使用してhttps://github.com/thoughtbot/bourbon/issues/120を、報告された問題です私のメインのCSSファイルにインポートステートメントを直接追加して解決しました。しかし、私は本当にこれらのインポートステートメントを各ファイルに追加し続けたいので、私はこの問題を解決したいと思います。

Answer 3

私は同じ問題がありました。

@include outer-containerを使用してdivを作成し、@include span-columns（8）を含むdivを作成しました。 2番目のdivは間違って最初のものの外側に座り、誤解を招くエラー "Undefined mixin 'outer-container'"を生成します。 2番目のdivを最初の内側（CSSとHTMLの外側のコンテナ内）に移動すると、問題が修正されました。

上記の問題については、pタグがフッターの子であることを確認して同じことを行う必要があります。

Answer 4

私はこの同じ問題を抱えていました。私の解決策は、部分ファイルの名前をlayout.css.scssから_layout.css.scssに変更することでした。これらのミックスインがロードされた後に、SASSミックスインを使用するファイルが含まれている必要があります。この場合、参照していたミックスインのソースは必要ありませんが、layout.cssファイルのみをプリコンパイルしようとしています。アンダースコアを追加すると、別のファイルが必要とするまで、プリコンパイラはそのファイルを無視します。

Answer 5

Change Logによれば、outer-container mixinはバージョン2.0.0から削除されています。 outer-containerで使用できる最高のバージョンは1.8.0です。 Bundler経由でNeatを追加すると、Gemfileにバージョンを指定しない限り、2.0以上の値を取得します。

これを行うにはnew wayがはるかに簡単に見えますが、サポートされていないscssがたくさんある場合はほとんど問題ありません。