You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Currently, deploying a Filament panel on a sub-path (e.g., example.com/app) alongside a frontend SPA (like Vue.js) on the root domain (example.com/) is extremely difficult to configure at the Nginx/web-server level.
The Problem:
My architecture is as follows:
The root domain / serves a static Vue.js frontend application.
The sub-path /app serves the Filament PHP panel.
The issue arises with asset routing. Vue expects its assets at the root, but Filament and Livewire also request assets from root-relative paths by default (e.g., /livewire/livewire.js or /filament/assets/...).
Configuring Nginx to correctly route / to Vue, while intercepting specific asset paths for Filament and Livewire and routing them to Laravel's index.php, is highly complex and error-prone.
While it is possible to manually tweak Laravel's ASSET_URL and use Livewire::setScriptRoute(), it feels like there should be a native, streamlined way within Filament to handle this, as sub-folder deployments are a common use case.
Proposed Solution:
Introduce a configuration method in the PanelProvider that allows setting a unified global asset prefix for the specific panel.
Ensure all Filament core CSS/JS assets are requested with this prefix.
Automatically configure Livewire's update and script routes (Livewire::setScriptRoute / Livewire::setUpdateRoute) to use this prefix.
This would allow developers to easily configure Nginx with a single location ^~ /app-assets/ block that routes directly to Laravel, leaving the rest of the root domain cleanly handled by the SPA frontend.
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
Uh oh!
There was an error while loading. Please reload this page.
-
Currently, deploying a Filament panel on a sub-path (e.g.,
example.com/app) alongside a frontend SPA (like Vue.js) on the root domain (example.com/) is extremely difficult to configure at the Nginx/web-server level.The Problem:
My architecture is as follows:
/serves a static Vue.js frontend application./appserves the Filament PHP panel.The issue arises with asset routing. Vue expects its assets at the root, but Filament and Livewire also request assets from root-relative paths by default (e.g.,
/livewire/livewire.jsor/filament/assets/...).Configuring Nginx to correctly route
/to Vue, while intercepting specific asset paths for Filament and Livewire and routing them to Laravel'sindex.php, is highly complex and error-prone.While it is possible to manually tweak Laravel's
ASSET_URLand useLivewire::setScriptRoute(), it feels like there should be a native, streamlined way within Filament to handle this, as sub-folder deployments are a common use case.Proposed Solution:
Introduce a configuration method in the
PanelProviderthat allows setting a unified global asset prefix for the specific panel.For example:
Behind the scenes, this method would:
Livewire::setScriptRoute/Livewire::setUpdateRoute) to use this prefix.This would allow developers to easily configure Nginx with a single
location ^~ /app-assets/block that routes directly to Laravel, leaving the rest of the root domain cleanly handled by the SPA frontend.Beta Was this translation helpful? Give feedback.
All reactions