Установить динамические переменные в SCSS с помощью npm - PullRequest
Новая
       10

Установить динамические переменные в SCSS с помощью npm

0 голосов
/ 07 декабря 2018

У меня нет большого опыта работы с npm и SCSS, поэтому у меня возникает следующий вопрос:

У меня есть один файл SCSS (app.scss), в котором есть много мест, в которых я использую один цвет по умолчаниюдля фона.Моя идея состоит в том, чтобы иметь переменную $ background_color, чтобы я мог легко изменить этот цвет.Возможно ли это, и если да, то как?

Вот код моего mix.js: 

const mix = require('laravel-mix');

mix.setPublicPath('public');

mix.sass('resources/sass/frontend/app.scss', 'css/frontend/frontend.css')
    .sass('resources/sass/backend/app.scss', 'css/backend/backend.css')
    .js('resources/js/frontend/app.js', 'js/frontend.js')
    .js([
        'resources/js/backend/before.js',
        'resources/js/backend/app.js',
        'resources/js/backend/after.js'
    ], 'js/backend/backend.js')
    .extract([
        'jquery',
        'bootstrap',
    ]);

if (mix.inProduction() || process.env.npm_lifecycle_event !== 'hot') {
    mix.version();
}

1 Ответ

0 голосов
/ 07 декабря 2018

sass позволяет использовать многократно используемые переменные: 

$color-blue: #0C4376;

для использования следующим образом: 

.box {
  width: 200px;
  height: 50px;
  background-color: $color-blue; // variable used here
}

https://sass -lang.com / guide

...