如何僅在存在指南針時才導入scss文件？

Question

我需要爲項目的每個安裝都有特殊的scss文件，所以我不想將它包含在git壓縮文件中。但即使這個文件不存在，一切都應該工作。

是否有任何方法可以@import scss文件只有存在，忽略文件未找到錯誤？

Answer 1

您需要使用「導入路徑」選項才能執行此操作，其中要導入的路徑包含要導入的後備文件（在我們的情況下，我們需要一個空文件）。

選項1：香草薩斯

文件結構

├── fallback 
    ├── _example.scss // <-- our blank file 
├── _example.scss // <-- the file for the user to customize (optional) 
├── style.scss 

在style.scss：

@import "example"; 
/* the rest of our styles */ 

當你運行你的SASS命令，你會寫像這個：

sass --watch ./css:./sass --load-path ./sass/fallback 

請注意，回退目錄不必位於sass目錄中，它位於您喜歡的文件系統的任何位置。

參見：How does SCSS locate partials?

選項2：北斗擴展

您可能會發現創建一個指南針擴展更方便一點，如果你正在使用在多個項目中這種技術。它會自動爲您設置負載路徑。您可以在此處瞭解有關創建擴展程序的更多信息：http://compass-style.org/help/tutorials/extensions/

Answer 2

也許與sass-globbing和可選文件的命名約定遵循特定的加載順序。

考慮下面的樹：

stackoverflow-14975341/ 
├── .gitignore 
├── config.rb 
├── css/ 
│   └── screen.css 
└── sass/ 
    ├── optionals/ 
    │   ├── .gitkeep 
    │   ├── _01_style.scss 
    │   └── _03_style.scss 
    └── screen.scss 

這些文件：

# config.rb 
require 'sass-globbing' 

sass_dir = 'sass' 
css_dir = 'css' 
relative_assets = true 

和

// sass/screen.scss 
@import "optionals/*"; 

和

// sass/optionals/_01_style.scss 
.optional1 { 
    background-color: red; 
} 

和

// sass/optionals/_03_style.scss 
.optional3 { 
    background-color: green; 
} 

，並在.gitignore：

sass/optional/* 

最後，保持optional文件夾，創建一個名爲.gitkeep一個空文件（文件名並不重要）。

當您編譯樣式表時，即使文件_02_style.scss缺失，Compass也會生成screen.css。

// css/screen.css 
/* line 1, ../sass/optionals/_01_style.scss */ 
.optional1 { 
    background-color: red; 
} 

/* line 1, ../sass/optionals/_03_style.scss */ 
.optional3 { 
    background-color: green; 
} 

當然可以根據導入附加路徑改進系統。