Alpine component ax-load-src doesnt fetch in v4

Hello, I've tried to update some package to use v4 and registering alpine component and usage, doesnt fetch the file even tho it exists and it is accessible.

AlpineComponent::make('package', __DIR__ . '/../resources/dist/package.js') // In service provider

AlpineComponent::make('package', __DIR__ . '/../resources/dist/package.js') // In service provider

<div
        ax-load
        ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('package', 'owner/package') }}"
        x-data="doStuff({
            state: $wire.entangle('{{ $getStatePath() }}'),
        })"
    >

<div
        ax-load
        ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('package', 'owner/package') }}"
        x-data="doStuff({
            state: $wire.entangle('{{ $getStatePath() }}'),
        })"
    >

Same thing works in v3

Solution

The syntax of Async Alpine changed with v2: https://async-alpine.dev/docs/

I know Dan built a compatibility layer for v3. Not sure whether that also works in v4

Async Alpine

Getting Started — Async Alpine Documentation

How to get started with Async Alpine to load Alpine.js components lazily, for a quick start using a CDN.

Jump to solution

Filament•8mo ago•

4 replies

Sasa Orasanin

Alpine component ax-load-src doesnt fetch in v4

Hello, I've tried to update some package to use v4 and registering alpine component and usage, doesnt fetch the file even tho it exists and it is accessible.

AlpineComponent::make('package', __DIR__ . '/../resources/dist/package.js') // In service provider

AlpineComponent::make('package', __DIR__ . '/../resources/dist/package.js') // In service provider

<div
        ax-load
        ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('package', 'owner/package') }}"
        x-data="doStuff({
            state: $wire.entangle('{{ $getStatePath() }}'),
        })"
    >

<div
        ax-load
        ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('package', 'owner/package') }}"
        x-data="doStuff({
            state: $wire.entangle('{{ $getStatePath() }}'),
        })"
    >

Same thing works in v3

Solution

The syntax of Async Alpine changed with v2: https://async-alpine.dev/docs/

I know Dan built a compatibility layer for v3. Not sure whether that also works in v4

Async Alpine

Getting Started — Async Alpine Documentation

How to get started with Async Alpine to load Alpine.js components lazily, for a quick start using a CDN.

Jump to solution

Alpine component ax-load-src doesnt fetch in v4

Similar Threads

Alpine component ax-load-src doesnt fetch in v4

Similar Threads

Similar Threads

Similar Threads