Filament•4w 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•4w 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•4w 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•4w 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•4w 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•4w 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•4w 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•4w 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•4w ago

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

Diogo Pinto•4w 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•4w ago

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

Diogo Pinto•4w ago

But the docs explain it really well

CitizenOP•4w 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?