Filament•16mo ago

How to include Vite compiled JS into admin panel?

I am creating a custom field, that needs to use a JS library. I am importing that library and initializing it from npm modules. So afaik, I need to make sure this is built by Vite, i.e. I could add it app.js, but it seems that the layout for the default admin panel does not include app.js. How can I go about including a compiled JS file from Vite into my Filament admin pages?

Solution:

Alright. Looks like I solved it following these steps:

Jump to solution

4 Replies

Solution

Wessire•16mo ago

Alright. Looks like I solved it following these steps:

WessireOP•16mo ago

1. Add render hook on the admin panel

$panel->renderHook(
  'panels::body.start',
  fn (): string => Blade::render('@vite("resources/js/script.js")'),
);

$panel->renderHook(
  'panels::body.start',
  fn (): string => Blade::render('@vite("resources/js/script.js")'),
);

2. Register script with Vite config inputs

laravel({
  input: [
    ...
    "resources/js/script.js",
  ],

laravel({
  input: [
    ...
    "resources/js/script.js",
  ],

*•14mo ago

This saved my life, thanks for sharing.

MAF•4mo ago

Thank you! for sharing the solution.

Gaming

Programming

How to include Vite compiled JS into admin panel?