Filament•8mo ago

Enable Echo.js without breaking Hot Reload

Ok I'm at my wit's end here... I know this is probably not strictly Filament related, but maybe there's a JS wizard here that can help I'm trying to enable broadcasting. Here are the relevant files

// echo.js
import Echo from 'laravel-echo';
import Pusher from 'pusher-js';

window.Pusher = Pusher;

window.Echo = new Echo({
    broadcaster: 'reverb',
    ...
    enabledTransports: ['ws', 'wss'],
});

// echo.js
import Echo from 'laravel-echo';
import Pusher from 'pusher-js';

window.Pusher = Pusher;

window.Echo = new Echo({
    broadcaster: 'reverb',
    ...
    enabledTransports: ['ws', 'wss'],
});

// AppServiceProvider.php
FilamentAsset::register([
    Js::make('echo', Vite::asset('resources/js/echo.js')),
]);

// AppServiceProvider.php
FilamentAsset::register([
    Js::make('echo', Vite::asset('resources/js/echo.js')),
]);

//vite.config.js
export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
                'resources/js/echo.js',
                'resources/css/filament/theme.css',
            ],
        }),
    ],

});

//vite.config.js
export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
                'resources/js/echo.js',
                'resources/css/filament/theme.css',
            ],
        }),
    ],

});

As you can see, most of the code is boilerplate. It works when I run npm run build , but when I run npm run dev I get the following error.

Uncaught SyntaxError: import.meta may only appear in a module

Uncaught SyntaxError: import.meta may only appear in a module

in firefox and

Uncaught SyntaxError: Cannot use 'import.meta' outside a module

Uncaught SyntaxError: Cannot use 'import.meta' outside a module

inside the echo.js file

import.meta.env = {"VITE_PUSHER_APP_KEY":"","VITE ....

import.meta.env = {"VITE_PUSHER_APP_KEY":"","VITE ....

Has anyone run into something similar? Any suggestions? Googling for this error doesn't get me anything useful.

3 Replies

exikoz•5mo ago

Try Js::make('script', url('path/to/script.js'))->module() Refence https://github.com/filamentphp/filament/issues/8015

GitHub

FilamentAsset registering Js without path causes problems · Issue #...

Package Other Package Version v3.0.29 Laravel Version v10.19.0 Livewire Version v3.0.0-beta.10 PHP Version 8.2.9 Problem description I was running php artisan filament:upgrade command. Expected beh...

exikoz•5mo ago

I just tried it like this Js::make('echo', Vite::asset('resources/js/echo.js'))->module(), and it works the script is loaded.

ChesterSOP•5mo ago

I'll have a look

Gaming

Programming

Enable Echo.js without breaking Hot Reload