Filament•2mo ago

Panel ->assets() result in 404. What am I missing?

I'm new to Filament and have been following the guide. I got to this point and followed the directions to create a custom css sheet in resources/css/filament-organize.css: https://filamentphp.com/docs/3.x/panels/configuration#registering-assets-for-a-panel In my network tab, I get this error: http://localhost/css/app/filament-organize.css?v=3.2.121.0 404 not found Sure enough, that file doesn't exist at that path. Do I need to do anything else config-wise to get this to work? My code:

->assets([
                Css::make('filament-organize', resource_path('css/filament-organize.css')),
            ]);

->assets([
                Css::make('filament-organize', resource_path('css/filament-organize.css')),
            ]);

Configuration - Panel Builder - Filament

Solution:

What are you really trying to do? If you want to customize your look and feel you can create a custom-theme, it’s the recommended way to do so

Jump to solution

12 Replies

CitizenOP•2mo ago

Ok, so I found in the assets docs that I need to run php artisan filament:assets which I did and now it works. Do we just need to know this command and run it when we make css changes, or should this be added to my npm run dev command somehow? What's the normal setup here?

CitizenOP•2mo ago

I added a pull request here to add this to the config docs since it isn't clear. Is this accurate? https://github.com/filamentphp/filament/pull/14629

GitHub

Update 09-configuration.md by RyanPaiva56 · Pull Request #14629 · f...

Added directions to build assets. Description Added text to let new users know that they need to build these assets before they can be used. Visual changes No visual changes. Functional changes No...

Diogo Pinto•2mo ago

When making changes to your assets you can run npm run dev to watch it live. Once you’re done you can run npm run build to compile all the classes. Run this in your project’s directory Root directory*

CitizenOP•2mo ago

I solved it by adding it to vite since I use @apply tailwind classes. This works for me:

->assets([
                Css::make('filament-organize', Vite::asset('resources/css/filament-organize.css')),
            ]);

->assets([
                Css::make('filament-organize', Vite::asset('resources/css/filament-organize.css')),
            ]);

Solution

Diogo Pinto•2mo ago

What are you really trying to do? If you want to customize your look and feel you can create a custom-theme, it’s the recommended way to do so

CitizenOP•2mo ago

I didnt want to do a whole theme just to add a few classes to the main div Should I anyway? I'm new and definitely want to do things the 'right' way Having one sheet per panel kinda makes sense which is why I did it this way

Diogo Pinto•2mo ago

Creating a custom theme seems like the best way to do it. But this is Laravel/Filament, there are lots of ways to kill a rabbit as we say in Portugal Custom themes are panel based too. You can reuse a theme for other panels or create one for each I always recommend Following the documentation because if the projects grows and other devs pick it up, things are mostly standard

CitizenOP•2mo ago

I'm portugese as well, but in USA. Obrigado friend 🙂 I'll make a theme and have fun with it, thanks!

Diogo Pinto•2mo ago

De nada! 🇵🇹 if you give me your GitHub username I’ll add you to a private repository with a full guide on how to build a theme, that I’ll try to merge with the official docs It’s private for the moment as I only want to share it when completed

CitizenOP•2mo ago

Thanks I think for now I'll keep it simple but I'll dm when I get to the advanced stuff

Diogo Pinto•2mo ago

But the docs explain it really well

CitizenOP•2mo ago

Sent! From the docs, making a theme was definitely the way to go. Thank you!

Gaming

Programming

Panel ->assets() result in 404. What am I missing?