對部分文件導入部分文件無法識別變量

Question

導入部分文件在style.scss上時。它工作正常。所有變量工作正常。

style.scss

@import 'base/variable'; 

//Component 
@import 'component/menubar'; 
@import 'component/menubar-mascot'; 
@import 'component/menubar-count'; 
@import 'component/menubar-button'; 

但是，當我嘗試合併菜單欄SCSS部分文件，這樣

style.scss

@import 'base/variable'; 

//Component 
@import 'component/menubar'; 

menubar.scss

@import 'menubar-mascot'; 
@import 'menubar-count'; 
@import 'menubar-button'; 

上variable.scss它不能讀取，但是當我再次variable.scss導入上menubar.scss，這樣

menubar.scss

@import '../base/variable'; 
@import 'menubar-mascot'; 
@import 'menubar-count'; 
@import 'menubar-button'; 

它的做工精細的變量，爲什麼呢？以及如何解決這個問題，而無需再次導入variables.scss在menubar.scss？

Answer 1

我假設menubar-mascot位於你運行sass命令的地方。 出於某種原因，嵌套導入中的絕對路徑似乎未找到。

@import 'menubar-mascot'; 
@import 'menubar-count'; 
@import 'menubar-button'; 

但是，如果您使用相對的一個它會找到它。因此，相對於你的包SCSS文件，你可以這樣做：

@import '../menubar-mascot'; 
@import '../menubar-count'; 
@import '../menubar-button'; 

因此它會從組件夾回回到根，找到正確的文件。