Plugin not working

[dominikgeimer]

Hey guys,

I really love Filament. It is awesome.

I want to use Charts.css inside of Filament. I need to add the stylesheet..

As described in the documentation, a created a simple service provider and it extends the filament service provider.

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Filament\PluginServiceProvider;

class ChartsCssProvider extends PluginServiceProvider
{
    protected $styles = [
        'charts-css-styles' => 'https://cdn.jsdelivr.net/npm/charts.css/dist/charts.min.css',
    ];

    /**
     * Register services.
     *
     * @return void
     */
    public function register()
    {
        //
    }

    /**
     * Bootstrap services.
     *
     * @return void
     */
    public function boot()
    {
        //
    }
}

I also registered it inside config/app.php providers.

App\Providers\ChartsCssProvider::class,

I also tried it with a leading backslash.

But it seems not to work. I can't see any new style inside the head and Charts.css does not work.

Anything I am missing?

Thanks, Dominik

[danilopolani]

See the answer below.

---

It does not work to me too, however using Filament::registerStyle inside the boot() method of your provider works just fine:

/**
 * Bootstrap services.
 *
 * @return void
 */
public function boot()
{
    Filament::serving(function () {
        Filament::registerStyle('charts-css-styles', 'https://cdn.jsdelivr.net/npm/charts.css/dist/charts.min.css');
    });
}

[dominikgeimer]

Thanks! That worked for me.

[danilopolani]

@dominikgeimer at the end the answer is easier: since you have a register() method in your ServiceProvider, it overwrites the PluginServiceProvider one and therefore the Filament "hooks" are not triggered.

If you remove the register() (and boot() if you want, but not required) method from your provider you can still use the protected $styles syntax 😅