Laravel Mix: Как скопировать файлы в каталог перед тем, как приступить к микшированию sass - PullRequest
Новая
       85

Laravel Mix: Как скопировать файлы в каталог перед тем, как приступить к микшированию sass

1 голос
/ 11 июля 2020

Так что мой вариант использования состоит в том, что у меня есть несколько разных «тем», которые будут использоваться в laravel webapp. Я планирую использовать mix.copyDirectory() для копирования определенных файлов c s css для этой темы перед выполнением фактического шага mix.sass. Я установил переменную laravel .env, чтобы контролировать, какую тему включать в сборку.

Я сделал что-то подобное в webpack.mix.js: 

mix.copyDirectory('resources/sass/' + process.env.MIX_THEME, 'resources/sass/build')
    .js('resources/js/app.js', 'public/js')
    .sass('resources/sass/build/app.scss', 'public/css');

Файлы, скопированные в ресурсы / sass / build включает _variables.scss, который также импортируется моими Vue компонентами. (Таким образом, компоненты разделяют цвета и другие общие стили)

Теперь проблема, с которой я столкнулся, заключается в том, что при первом запуске (через npm run dev) я получаю ошибки, что _variables.scss отсутствует в папке сборки . При втором запуске все нормально! Итак, я думаю, что происходит то, что микс запускает copyDirectory, но переходит к шагам js и sass до завершения copyDirectory.

Итак, мой вопрос: есть ли способ заставить copyDirectory дождаться завершения sh перед тем, как перейти к другим шагам (не нашел в документации)? Или, если нет, есть ли лучший способ сделать то, что я пытаюсь сделать?

1 Ответ

0 голосов
/ 12 июля 2020

Поскольку моя основная проблема заключалась в том, что я хотел вытащить общий файл S CSS, используемый Vue компонентами, из другой папки, мое решение оказалось решением из этого вопроса vue .config. js в (laravel) webpack.mix. js

По сути, я использовал globalVueStyles в mix.options для переключения на другой общий файл _variables вместо того, чтобы импортировать его вручную в каждый компонент. 

mix.options({
    extractVueStyles: true,
    globalVueStyles: 'resources/sass/' + process.env.MIX_THEME + '/_variables.scss'
});
...