Laravel Смешайте один sass с несколькими css - PullRequest
0 голосов
/ 19 февраля 2020

При попытке это сделать:

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css/app_blue.css', {
        data: '$theme-bg-primary: #1450d9;'
    })
    .sass('resources/sass/app.scss', 'public/css/app_red.css', {
        data: '$theme-bg-primary: #ba0000;'
    });

вывод npm равен should not contain the item '[...]/app.scss' twice.

Как вывод 2 отличает css от одного источника как app.s css

Ответы [ 2 ]

1 голос
/ 19 февраля 2020

Вместо того, чтобы вводить данные в вызов mix, вам нужно создать заглушку s css для каждой создаваемой темы.

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app_red.scss', 'public/css')
   .sass('resources/assets/sass/app_blue.scss', 'public/css')

Где эти файлы s css включают основание app.scss и отменяет вводимое вами значение data.

0 голосов
/ 19 февраля 2020

Поскольку вы используете разные значения переменных для обоих файлов css. Вы должны дважды вызвать .sass, но для дальнейшей оптимизации я бы предложил вам использовать переменные.

например,

const cssSourceDir = 'resources/sass/';
const cssPublicDir = 'public/css/';
const commonSassFile = `${cssSourceDir}/app.scss`;

Дублирование может быть удалено следующим образом

mix.js('resources/js/app.js', 'public/js')
.sass(commonSassFile, cssPublicDir+'/app_blue.css', {
    data: '$theme-bg-primary: #1450d9;'
})
.sass(commonSassFile, cssPublicDir+'/app_red.css', {
    data: '$theme-bg-primary: #ba0000;'
});
...