2. Шаблон AdminLTE

Скачиваем AdminLTE .

Возьмем код из страницы AdminLTE-3.0.5\pages\examples\blank.html и перенесем его в наше представление resources/views/admin/index.blade.php .

Копируем в /resources/assets/ все нужные файлы для нашей страницы.

Объединение файлов в один с помощью webpack

Запишем в файл webpack.min.js:

mix.scripts([
'resources/assets/admin/plugins/jquery/jquery.min.js',
'resources/assets/admin/plugins/bootstrap/js/bootstrap.bundle.min.js',
'resources/assets/admin/js/adminlte.min.js',
'resources/assets/admin/js/demo.js',
],
'public/assets/admin/admin.js');

mix.styles([
'resources/assets/admin/plugins/fontawesome-free/css/all.min.css',
'resources/assets/admin/css/adminlte.min.css'
],
'public/assets/admin/admin.css');

mix.copyDirectory('resources/assets/admin/plugins/fontawesome-free/webfonts', 'public/assets/webfonts');
mix.copyDirectory('resources/assets/admin/img', 'public/assets/img');

mix.copy('resources/assets/admin/css/adminlte.min.css.map', 'public/assets/admin/adminlte.min.css.map');
mix.copy('resources/assets/admin/js/adminlte.min.js.map', 'public/assets/admin/adminlte.min.js.map');

Порядок файлов лучше сохранить, как в исходной странице.

И запустим nodeJS в командной строке:

npm install

Чтобы обновлять наши изменения используем:

npm run dev

Поменяем ссылки в нашем шаблоне на новые. Для корректности используем хелпер asset. Пример:

<script src="{{ asset('assets/admin/admin.js') }}"></script>

Перезагружаем страницу и смотрим в консоли, какие файлы не могут подгрузится в наш шаблон:

Меняем пути на правильные и делаем:

npm run dev

 

0 0 голос
Рейтинг статьи
Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии
0
Оставьте комментарий! Напишите, что думаете по поводу статьи.x
()
x