Simplifying Asset Updates in FilamentPHP Packages
Süleyman Özgür Özarpacı
Posted on November 23, 2024
For the past week, I’ve been developing a FilamentPHP package, and this process has taught me quite a bit. However, I’d like to share something with you that I couldn’t find in the documentation.
When you run npm run dev
during the development of your package, the files are built into the /resources/dist
directory at the root of your package. FilamentPHP then moves these files to the public
directory of your Laravel project when you execute the php artisan filament:assets
command. Therefore, every time you make a change in your FilamentPHP package, you need to run this command in the Laravel project you’re testing on to reflect the updates in the public
directory.
But what if I told you there’s an easier way? The magic word here is symlink ✨.
Checking File Names
First, open the service provider file of your package. For my package, this is the FilamentMenuBuilderServiceProvider.php
file.
In your getAssets
method, ensure that the exported file name matches the actual file name inside your package. This is crucial because when we create the symlink, the Filament panel will look for the file using the exported name. Since I’m only using a CSS file, my code looks like this:
protected function getAssets(): array
{
return [
// WRONG!
Css::make('filament-menu-builder-styles', __DIR__ . '/../resources/dist/filament-menu-builder.css'),
// CORRECT!
Css::make('filament-menu-builder', __DIR__ . '/../resources/dist/filament-menu-builder.css'),
];
}
For more information, please read the documention.
Creating a Symlink
The process of creating a symlink varies depending on your operating system. Since I’m using Windows, I utilize Link Shell Extension for this purpose.
I symlink the /resources/dist
directory to /public/css/{vendor_name}/{package_name}
in my Laravel project. For my project, this would be /public/css/biostate/filament-builder
. From now on, any changes in the dist
folder of my package will automatically reflect in the public
directory of my Laravel project.
Conclusion
By leveraging symlinks, you can significantly streamline your development process for FilamentPHP packages. This eliminates the repetitive task of running php artisan filament:assets
after every change, allowing you to focus more on building and less on manual updates.
Posted on November 23, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.