Come importare il file scss nella bussola solo se esiste?

Question

Ho bisogno di avere un file scss speciale che è diverso per ogni installazione del progetto, quindi non voglio includerlo nell'archivio git. Ma tutto dovrebbe funzionare anche se questo file non esiste.

C'è un modo per @import scss file solo se esiste, ignorando l'errore file non trovato?

Answer 1

È necessario utilizzare l'opzione "percorso di importazione" per eseguire questa operazione, in cui il percorso che si sta importando contiene i file di fallback che si desidera importare (nel nostro caso, si desidera un file vuoto).

Opzione 1: Vanilla Sass

struttura File

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

In style.scss:

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

Quando si esegue il comando di sass, si dovrebbe scrivere come this:

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

Si noti che la directory di fallback non deve essere all'interno della directory sass, si trova in qualsiasi punto del filesystem desiderato.

Consulta anche: How does SCSS locate partials?

Opzione 2: Bussola di estensione

Si può trovare che la creazione di un'estensione di Compass è un po 'più conveniente se si sta utilizzando questa tecnica in più progetti. Si imposterà automaticamente il percorso di carico per te. Puoi trovare ulteriori informazioni sulla creazione di estensioni qui: http://compass-style.org/help/tutorials/extensions/

Answer 2

Forse con sass-globbing e una convenzione di denominazione per i file opzionali seguono uno specifico ordine di caricamento.

Si consideri il seguente albero:

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

con questi file:

# config.rb 
require 'sass-globbing' 

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

e

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

e

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

.210

e

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

e, per la .gitignore:

sass/optional/* 

Infine, per mantenere la cartella optional, creare un file vuoto denominato .gitkeep (il nome del file non è importante).

Quando si compila il foglio di stile, Compass genera lo screen.css anche se manca il file _02_style.scss.

// 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; 
} 

È sicuramente possibile migliorare il sistema in base all'importazione di percorsi aggiuntivi.