Вы можете использовать Laravel Mix для компиляции препроцессоров CSS и JavaScript.Таким образом, вы сохраните все свои ресурсы в папке resources / assets.
Laravel Mix предоставляет свободный API для определения шагов сборки веб-пакета для вашего приложения с использованием нескольких распространенных препроцессоров CSS и JavaScript.
ДляПри использовании laravel mix вам сначала нужно установить node и npm.
Затем создайте файлы app.js и app.scss в каталогах resources / app / sass и resources / sass соответственно.Затем откройте файл webpack.mix.js, который будет находиться в корневом каталоге вашего проекта, и напишите следующий код в файле webpack.mix.js
В файле webpack.mix.js (вы можете увидеть этот файл вкорневой каталог проекта)
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css');
Теперь давайте посмотрим, что означают две вышеупомянутые строки?
mix.js('resources/assets/js/app.js', 'public/js') говорит, что нужно прочитать app.js содержимое (которое хранится в ресурсах/ js), вытяните их и поместите в public / js после того, как смешаете их.
То же самое для mix.sass.Поскольку он использует SAAS-совместимый, вы можете использовать синтаксис на основе CSS или SAAS для определения ваших макетов.В любом случае, Webpack скомпилировал их в один CSS.Теперь в master.blade.php все, что вам нужно сделать для этих двух вызовов ресурсов JS и CSS соответственно:
<script src="{!! asset('js/app.js') !!}"></script>
и
<link rel="stylesheet" href="{!! asset('css/app.css') !!}">
Теперь запустите команду npm run dev.Он скомпилирует ваши файлы CSS и JS и поместит сборку в общую папку.
Для подробного объяснения вы можете проверить
https://laravel.com/docs/5.7/mix
https://appdividend.com/2018/02/19/laravel-mix-compiling-assets-tutorial/