スタイラス、サブディレクトリインポートの順番は

Question

です。 スタイラスのインポートに問題があります。インポートのこのようMethodeのを使用してI'am私のプロジェクトで ： @import "project/**/*.styl"

そしてまた、私はこのBEMのフォルダ構造があります。一般的には

Project/ |- Project.styl |- Block1/ | |- Block1.styl | |- _Element1/ | | |- _Element1.styl | | |- __Modificator1/ | | | |- __Modificator1.styl |- Block2/ |- Block3/

を、問題がbundle.cssの準備ができているときということです、そのスタイルは間違った方向に行きます。まずそれにどのように私のコードが見えること...そしてmodificators、要素だけにして、ブロックを行くので、改質剤を常に要素によって上書きされ、finnaly彼らは動作しません：

HTML：

<div class="block1_element1 block1_element1__modificator1"></div>

CSS：結果で

.block1_element1__modificator1{font-size: 14px} .block1_element1{font-size: 16px}

は16pxにフォントサイズになります...

誰かがスタートへの分岐の端から順番を変更する方法を知っていれば、どのようにスタイラスのit.s

Answer 1

問題

間違った順序でファイルをインポート作るために私にアドバイスをお願いします。


スタイラスでをGlobing ファイルを使用する場合、すなわち名によって**/*スタイラスエンジンの受注ファイルはとてもインポートしたファイルの順序は、その後__Modificator(n).stylその後、_Element(n).stylBlock(n).stylなり

理由、そしてもちろんそれは間違って何を引き起こしていますCSSスタイル。


解決策

使用する各index.stylファイルのインポート内の各ディレクトリ/サブディレクトリ内のファイルindex.styl、その後、現在のディレクトリ内のすべてのファイルのすべてのサブディレクトリのすべてのファイルindex.styl。


例

プロジェクト構造は以下のようにする必要があります：

Project/ 
|- Project.styl 
|- Block1/ 
| |- index.styl 
| |- Block1.styl 
| |- _Element1/ 
| | |- index.styl 
| | |- _Element1.styl 
| | |- __Modificator1/ 
| | | |- index.styl 
| | | |- __Modificator1.styl 
|- Block2/ 
|- Block3/ 

そしてここindex.stylファイル

inside Project.styl 
@import "Block1" 
@import "Block2" 
... 

inside any Block directory index.styl file 
@import "_Element1" 
@import "_Element2" 
@import "Block1.styl" // current parent block 
... 

inside any Element directory index.styl file 
@import "__Modificator1" 
@import "__Modificator2" 
@import "_Element1.styl" // current parent Element 
...