Вы можете подключить любые ваши css и js файлы к MoonShine.
Глобальные ресурсы
Если вам нужно опубликовать ресурсы глобально для всех страниц, то вы можете добавить их в MoonShineServiceProvider
.
class MoonShineServiceProvider extends MoonShineApplicationServiceProvider{//...public function boot(): void{parent::boot();moonShineAssets()->add(['/css/style.css','/js/main.js',]);}//...}
class MoonShineServiceProvider extends MoonShineApplicationServiceProvider{//...public function boot(): void{parent::boot();moonShineAssets()->add(['/css/style.css','/js/main.js',]);}//...}
Ресурсы для ресурса/страницы
Ресурсы можно добавить для ресурса или для отдельной страницы. Для этого необходимо указать свойство $assets
.
class Post extends ModelResource{protected array $assets = ['/css/style.css','/js/main.js',];//...}
class Post extends ModelResource{protected array $assets = ['/css/style.css','/js/main.js',];//...}
Vite
Вы также можете добавить свои собственные ресурсы Vite:
use Illuminate\Support\Facades\Vite;class MoonShineServiceProvider extends MoonShineApplicationServiceProvider{//...public function boot(): void{parent::boot();moonShineAssets()->add([Vite::asset('resources/js/app.js')]);}//...}
use Illuminate\Support\Facades\Vite;class MoonShineServiceProvider extends MoonShineApplicationServiceProvider{//...public function boot(): void{parent::boot();moonShineAssets()->add([Vite::asset('resources/js/app.js')]);}//...}
Конфигурация
Вы можете настроить подключение ресурсов в файле конфигурации config/moonshine.php
.
// ...return [// ...'assets' => ['js' => ['script_attributes' => ['defer','type' => 'module']],'css' => ['link_attributes' => ['rel' => 'stylesheet']]],// ...];
// ...return [// ...'assets' => ['js' => ['script_attributes' => ['defer','type' => 'module']],'css' => ['link_attributes' => ['rel' => 'stylesheet']]],// ...];
Директива
Если вы хотите использовать стили и скрипты MoonShine вне административной панели, то вам нужно включить директиву @moonShineAssets
.
<head>@moonShineAssets</head>
<head>@moonShineAssets</head>