Filament•2mo ago

Creating custom theme breaks Vite

I followed documentation on: https://filamentphp.com/docs/3.x/panels/themes#creating-a-custom-theme Everything works fine after running npm run build, however npm run dev is no longer building assets and I get html only page. It seems like ->viteTheme('resources/css/filament/admin/theme.css') is causing this issue. Maybe anyone had similar issue? Running laravel 11 with sail.

Themes - Panel Builder - Filament

5 Replies

FirefliesOP•2mo ago

vite.config.js

import { defineConfig } from 'vite'
import laravel, { refreshPaths } from 'laravel-vite-plugin'

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/filament/admin/theme.css',
                'resources/css/app.css',
                'resources/js/app.js',
            ],
            refresh: [
                ...refreshPaths,
                'app/Filament/**',
                'app/Forms/Components/**',
                'app/Livewire/**',
                'app/Infolists/Components/**',
                'app/Providers/Filament/**',
                'app/Tables/Columns/**',
            ],
        }),
    ],
})

vite.config.js

import { defineConfig } from 'vite'
import laravel, { refreshPaths } from 'laravel-vite-plugin'

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/filament/admin/theme.css',
                'resources/css/app.css',
                'resources/js/app.js',
            ],
            refresh: [
                ...refreshPaths,
                'app/Filament/**',
                'app/Forms/Components/**',
                'app/Livewire/**',
                'app/Infolists/Components/**',
                'app/Providers/Filament/**',
                'app/Tables/Columns/**',
            ],
        }),
    ],
})

LeandroFerreira•2mo ago

what is the error?

FirefliesOP•2mo ago

npm run dev is working and running, but assets are not built. The only error I can see is in the browser: Failed to load resource: net::ERR_CONNECTION_REFUSED on theme.css

LeandroFerreira•2mo ago

vite config sounds good to me.. are you able to access this on the browser? your-url:5173/resources/css/filament/admin/theme.css @Fireflies does it work?

FirefliesOP•3w ago

I will try to test it and give you an answer later today Sorry for late response. The problem was with docker containers, not exactly sure but now sure. Thanks for help!

Gaming

Programming

Creating custom theme breaks Vite