JS not working on frontend with Fabricator Blocks
Hi, I am using the Fabricator plugin to create pages and blocks.
When I create a new dynamic page with Fabricator, the CSS works on the frontend, but the JavaScript does not. In my AppServiceProvider, I am already compiling Vite, but I also created a default.php layout file. What am I doing wrong? Can someone help me?
AppServiceProvider
namespace App\Providers;
use Illuminate\Foundation\Vite; use App\Filament\Tiptap\Jumbotron; use Illuminate\Support\HtmlString; use FilamentTiptapEditor\TiptapEditor; use Illuminate\Support\ServiceProvider; use Z3d0X\FilamentFabricator\Facades\FilamentFabricator;
class AppServiceProvider extends ServiceProvider
public function register(): void
//Register scripts
FilamentFabricator::registerScripts([
app(Vite::class)('resources/js/app.js'), //vite
]);
//Register styles
FilamentFabricator::registerStyles([
app(Vite::class)('resources/css/app.css'), //vite
]);
FilamentFabricator::favicon(asset('favicon.ico'));
}
default layout Blade file
@props(['page'])
Copy
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
<!-- Scripts -->
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body class="antialiased">
<x-filament-fabricator::layouts.base :title="$page->title">
{{-- Header Here --}}
@livewire('components.navbar')
<x-filament-fabricator::page-blocks :blocks="$page->blocks" />
{{-- Footer Here --}}
</x-filament-fabricator::layouts.base>
</body>
When I create a new dynamic page with Fabricator, the CSS works on the frontend, but the JavaScript does not. In my AppServiceProvider, I am already compiling Vite, but I also created a default.php layout file. What am I doing wrong? Can someone help me?
AppServiceProvider
namespace App\Providers;
use Illuminate\Foundation\Vite; use App\Filament\Tiptap\Jumbotron; use Illuminate\Support\HtmlString; use FilamentTiptapEditor\TiptapEditor; use Illuminate\Support\ServiceProvider; use Z3d0X\FilamentFabricator\Facades\FilamentFabricator;
class AppServiceProvider extends ServiceProvider
public function register(): void
//Register scripts
FilamentFabricator::registerScripts([
app(Vite::class)('resources/js/app.js'), //vite
]);
//Register styles
FilamentFabricator::registerStyles([
app(Vite::class)('resources/css/app.css'), //vite
]);
FilamentFabricator::favicon(asset('favicon.ico'));
}
default layout Blade file
@props(['page'])
Copy
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
<!-- Scripts -->
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body class="antialiased">
<x-filament-fabricator::layouts.base :title="$page->title">
{{-- Header Here --}}
@livewire('components.navbar')
<x-filament-fabricator::page-blocks :blocks="$page->blocks" />
{{-- Footer Here --}}
</x-filament-fabricator::layouts.base>
</body>
