Download the PHP package tofandel/inertia-bundle without Composer
On this page you can find all versions of the php package tofandel/inertia-bundle. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download tofandel/inertia-bundle
More information about tofandel/inertia-bundle
Files in tofandel/inertia-bundle
Package inertia-bundle
Short Description A Symfony adapter for Inertia.js
License MIT
Informations about the package inertia-bundle
Inertia.js Symfony Adapter
This is a Inertia.js server-side adapter based on inertia-laravel, but for Symfony 5 and 6.
Installation
First, make sure you have the twig, encore and serializer recipe:
Install using Composer:
Setup root template
The first step to using Inertia is creating a root template. We recommend using app.html.twig
. This template should
include your assets, as well as the inertia(page)
function
The inertia()
function is a helper function for creating our base div
. It includes a data-page
attribute which
contains the initial page information. This is what it looks like:
If you'd like a different root view, you can change it by creating a config/packages/rompetomp_inertia.yaml
file
and including this config:
Set up the frontend adapter
Find a frontend adapter that you wish to use here https://github.com/inertiajs. The README's are using Laravel's Webpack Mix. It's not hard translating this to Webpack Encore, just follow the documentation here: https://symfony.com/doc/current/frontend.html.
Webpack Encore Examples
For Vue:
For React:
For Svelte:
Making Inertia responses
To make an Inertia response, inject the Rompetomp\InertiaBundle\Service\InertiaInterface $inertia
typehint in your
controller, and use the render function on that Service:
Sharing data
To share data with all your components, use $inertia->share($key, $data)
. This can be done in an EventSubscriber:
View data
If you want to pass data to your root template, you can do that by passing a third parameter to the render function:
You can also pass these with the function viewData
, just like you would pass data to the share
function:
You can access this data in your layout file under the viewData
variable.
Asset versioning
Like in Laravel, you can also pass a version to the Inertia services by calling
Lazy Prop
It's more efficient to use lazy data evaluation server-side you are using partial reloads.
To use lazy data you need to use Rompetomp\InertiaBundle\Service\Inertia::lazy
Sample usage:
The lazy
method can accept callable, array and string
When using string or array, the service will try to check if it is existing service in container if not
it will just proceed to call the function
Server-side rendering
For frontend configuration just follow the document https://inertiajs.com/server-side-rendering#setting-up-ssr
Setting up Encore / webpack
To run the webpack properly install webpack-node-externals
Next we will create a new file namely webpack.ssr.config.js
this is almost the same with
your webpack.config.js
. Remember that you need to keep this both config.
Here is an example file for webpack.ssr.config.js
Enabling SSR
To enable the ssr you need to add a configuration for your package config/packages/rompetomp_inertia.yaml
file
Building your application
You now have two build processes you need to run—one for your client-side bundle, and another for your server-side bundle:
The build folder for the ssr will be located in public/build-ssr/ssr.js
.
You can change the path by changing the output path (setOutputPath) in your ./webpack.ssr.config.js
Running the Node.js Service
To run the ssr service you will need to run it via node.
This will be available in http://127.0.0.1:13714
where this is the path we need to put in our ssr.url
Projects using this bundle
- Ping CRM on Symfony - The official Inertia.js demo app, ported to Symfony
- Symfony + Inertia + Vuejs Template - Github template repository that uses Symfony, Webpack/Encore, Inertia and Vuejs
- Symfony + Vite + Inertia + Vuejs Template - Github template repository uses Symfony, Vite, Inertia and Vuejs
All versions of inertia-bundle with dependencies
ext-json Version *
symfony/config Version ^4.4|^5.1.7|^6.0
symfony/yaml Version ^4.4|^5.1.7|^6.0
symfony/dependency-injection Version ^4.4|^5.1.7|^6.0
symfony/http-kernel Version ^4.4|^5.1.7|^6.0
symfony/http-client Version ^4.4|^5.1.7|^6.1
twig/twig Version ^2.12|^3.0
illuminate/support Version ^9.9|^10