Używam Gulp jako mojego systemu kompilacji.Jak ustawić zmienną sass przy użyciu zmiennej środowiskowej?
muszę zidentyfikować linki kierujące do stron zewnętrznych z SCSS następujące zasady:
// Links to external websites
a[href*='//']:not([href*='example.com']) {
&::after {
content: ' \e895';
font-family: 'Material Icons';
}
}
LUB
$baseURL: 'localhost:3000'; // Set this variable based on environment
a[href*='//']:not([href*='#{$baseurl}']) {
...
}
Kiedy biegnę serwer Development adres Jestem obsługujących pliki to localhost:3000, a nie example.com. W rezultacie każdy pojedynczy link na stronie internetowej (na serwerze dev) ma małą ikonę wskazującą, że link prowadzi do zewnętrznej strony internetowej, co jest naprawdę rozpraszające.
Jaki jest najlepszy sposób ustawienia zmiennej scss na podstawie ustawień środowiska?
Edit:
To rozwiązanie działa, ale wprowadza tymczasowy plik, którego nie jestem dzikie o. Przeniosłem swój _variables.scss do katalogu głównego scss, przetwarzam ten plik i wyprowadzam go do podkatalogu base, w którym jest on używany do kompilowania skryptu. Dodałbym wtedy scss/base/_variables.scss do mojego .gitignore, aby uniknąć zatwierdzenia kontroli wersji.
_variables.scss
$baseURL: '/* @echo PATH */';
Gulpfile.js
// Set baseurl as Sass variable -- used to identify external links
gulp.task('sass-vars', function() {
var baseURL = (config.production) ? 'example.com' : 'localhost:3000';
return gulp.src('./scss/_variables.scss')
.pipe($.preprocess({context: {PATH: baseURL}}))
.pipe(gulp.dest('./scss/base'));
});
Spójrz na: https://github.com/dlmanning/gulp-sass/issues/280 – sobolevn
Możliwe duplikaty: http://stackoverflow.com/questions/15153613/provide-sass-variables-definitions-on -komenda-line, http://stackoverflow.com/questions/14506578/use-variable-defined-in-config-rb-in-scss-files – cimmanon
Oba te rozwiązania używają ruby / kompasu, który zawiera plik konfiguracyjny, który pozwala aby ustawić zmienne środowiskowe sass. – Roy