Railsアセット：奇妙な動作のプリコンパイル

Question

assets:precompileタスクの奇妙な動作の前、または少なくとも私が完全に理解していないものの前に自分自身が見つかりました。

私はWebアプリケーション用にRails 3.1.3、Sprockets 2.0.3、Less 2.0.11を使用していますが、レイアウト用にBootstrapを使用していますので、less-rails 2.1.8以下も使用しています。 -rails-bootstrap 2.0.8。 hereと同じようにスタイルをカスタマイズしました。

私の資産の構成は次のとおりです。application.css.scssで

stylesheets 
|--application.css.scss 
|--custom-style/ 
    |--variables.less 
    |--mixins.less 
    |--buttons.less 
|--custom-style.css.less 

私は

//=require custom-style 

そして、私はbuttons.lessで最後に

@import "twitter/bootstrap/reset"; 
//@import "twitter/bootstrap/variables"; // Modify this for custom colors, font-sizes, etc 
@import "custom-style/variables"; 
//@import "twitter/bootstrap/mixins"; 
@import "custom-style/mixins"; 
// And all the other standar twitter/bootstrap imports... 

// Other custom-style files to import 
@import "custom-style/buttons" 
//... 

// And other rules here 
//... 

を行うカスタムスタイルで操作を行います私は、variables.lessとmixins.less Bで定義されているいくつかの変数とミックスインを使用していますootstrapファイル、@whiteおよび.buttonBackgroundを指定してください。

私は上記の構成でbundle exec rake assets:precompileを起動すると、タスクが失敗し、私はこのエラーを取得する：

$ bundle exec rake assets:precompile 
/usr/local/rvm/rubies/ruby-1.9.3-p0/bin/ruby /usr/local/rvm/gems/ruby-1.9.3-p0/bin/rake assets:precompile:all RAILS_ENV=production RAILS_GROUPS=assets 
rake aborted! 
.buttonBackground is undefined 

しかし、私がしなければ、これは

buttons.less --> buttons.css.less 

@import "buttons" --> @import "buttons.css.less" 

すべてが正常に動作変化することです！

ネストされたインポートで作業する場合、変数と関数の範囲が狭いのですか？あるいは、以下のパーサ、すなわちSprocketsがインポートツリーを処理する順序と関係があるものはありますか？

私は何かを見逃しているか間違った方法で何かをしていますか？

感謝:)

注：は私も元の変数とミックスインファイルでエラーが出るので、それはそれらに行わオーバーライドと接続されていません。

Answer 1

ファイルの名前をbuttons.css.lessに変更しましたが、拡張子を@import（つまり、@import "buttons"）のままにしましたか？

これは私がSCSSでそれを行う方法であり、正常に動作します。

別の考え方は、application.css.lessの//=require custom-styleを@import "custom-style"という指令に置き換えることです。あなたは） を：私は今、二つの可能性の一つと考えることができます

If you want to use multiple Sass files, you should generally use the Sass @import rule instead of these Sprockets directives. Using Sprockets directives all Sass files exist within their own scope, making variables or mixins only available within the document they were defined in.

Answer 2

：Rails Guide hereは（SCSS/LESSで処理される）@importを（スプロケットで処理されている）//=requireかけている使用することをお勧めしますapplication.css.scssをapplication.cssに変更する必要があります。以下、使用：代わりに、スプロケットの

@import "custom-style";

//= require ...

2）LESSコンパイラは、セミコロンについて非常に凝り性です。私は、あなたが持っていることに気づいた @import "custom-style/buttons" - それは@import "custom-style/buttons";

ダンノ問題は本当に簡単ですが、それはスタートです。

Answer 3

これは本当にあなたの質問に答えるわけではありませんが、あなたは喧嘩を混合しているだけで、Twitterのブートストラップを使う唯一の理由ですか？ちょうどサスを使用するのが好きな人は、bootstrap-sassのように、作者がlessをscssに変換するいくつかのブートストラップの宝石があります。私がプロジェクトで両方をやりとりしようとして時間を無駄にする前に、私は完全に1つまたは他のものに買いましたが、それは私の意見です。