手寫筆，子目錄導入的順序

Question

大家。 我有一個手寫筆導入問題。 在我的項目我'使用進口的此類梅索德： @import "project/**/*.styl"

，也是我有這個BEM文件夾結構：

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

一般來說，問題是，當bundle.css準備，它的風格走錯了路。首先在它進入的變質劑，然後要素才把數據塊，因此變質總是元素覆蓋，並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).styl然後Block(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 
...