Skip to content

Releases: adonisjs/inertia

Fix HMR server-side

04 Mar 14:44

Choose a tag to compare

Commits:

  • fix: hmr not working server-side e92d7c9

Full Changelog: v1.0.0-13...v1.0.0-14

Fix FOUC in Dev SSR

03 Mar 16:24

Choose a tag to compare

If you've had the opportunity to try SSR, you probably have noticed the huge FOUC in Dev when SSR was activated. This release fixes that. Read the PR to check out more about the implementation details

For this to work, you will need to specify the client-side entrypoint of your application. We have automatic detection for conventional locations, but if you've ever placed your entrypoint in another location or with another funky name, then make sure you pass it in your config/inertia.ts file.

// config/inertia.ts
import app from '@adonisjs/core/services/app'

defineConfig({
  entrypoint: app.makePath('resources/my-client-entry-point.ts')
})

What's Changed

Full Changelog: v1.0.0-12...v1.0.0-13

SSR Page Object

02 Mar 15:17

Choose a tag to compare

Commits

  • chore: update vite version 2de1520
  • fix: pass page object to the view when using ssr 42e4bd8

Full Changelog: v1.0.0-10...v1.0.0-12

Improvements

01 Mar 02:16

Choose a tag to compare

Changes

  • Added a renderInertia macro for brisk routes :

     router.on('/').renderInertia('home', { username: 'jul' })
  • Add a resolvePageComponent helper to resolving a specific Inertia pages :

     import { resolvePageComponent } from '@adonisjs/inertia/helpers'
     
     createInertiaApp({
       resolve: (name) => {
         return resolvePageComponent(
           `./pages/${name}`.tsx`, 
     	  import.meta.glob('./pages/**/*.tsx')
     	)
       },
       // ...
     })
  • Configuration hook is now complete. lets you add Inertia to an AdonisJS application, configured with or without SSR. It will also add all the files needed to have one dummy functional Inertia route, with components made with the frontend framework you've selected during the process.

Commits:

  • chore: add missing dependency 500bc49
  • refactor(configure): use brisk route in route example 22141c6
  • feat: added renderInertia brisk route macro 6403f72
  • refactor: polish configure instructions 15c1ef9
  • chore: update dependencies a797f8a
  • feat: add SSR prompt in configure hook 04f45be
  • fix(configure): await for route to be defined 6c9705e
  • chore: update incorrect include entry in tsconfig stubs eb15bd8
  • refactor: register edge bindings in boot method 5bbaefd
  • feat: resolvePageComponent helper 1615c2f
  • refactor: make inertia vite plugin options optional 857bdb0

Full Changelog: v1.0.0-8...v1.0.0-10

Experimental SSR Support

26 Feb 16:21

Choose a tag to compare

This version adds experimental support for SSR for Inertia. No breaking changes.

To try it, you'll need to do the following things

Update dependencies

Vite and entrypoint configuration

Now, having configured Vite in the correct way as explained, add the inertia plugin to your vite.config.ts :

import { defineConfig } from 'vite'
import adonisjs from '@adonisjs/vite/client'
import inertia from '@adonisjs/inertia/client'

export default defineConfig({
  plugins: [
    adonisjs({ ... }),
    // 👇👇
    inertia({
      ssr: {
        enabled: true,
        entrypoint: 'resources/ssr.ts',
      },
    }),
 ]
})

obviously, activate the SSR only if needed. entrypoint should point to your entrypoint server, as explained here

Please note a small difference we have with the Inertia documentation: we don't want to create a server, so we won't need to call createServer. We already have one server : AdonisJS itself. So instead,, your resources/ssr.ts will have to default export a function that renders your app. For Vue, for example, it will looks like this:

import { createInertiaApp } from '@inertiajs/vue3'
import { renderToString } from '@vue/server-renderer'
import { createSSRApp, h, ref, type DefineComponent } from 'vue'

export default function render(page) {
  return createInertiaApp({
    page,
    render: renderToString,
    resolve: (name) => {
      const pages = import.meta.glob<DefineComponent>('./pages/**/*.vue', { eager: true })
      return pages[`./pages/${name}.vue`]
    },
    setup({ App, props, plugin }) {
		return createSSRApp({ render: () => h(App, props) })
    },
  })
}

For the other frameworks, this will be detailed in the documentation, but it shouldn't be much different.

AdonisJS configuration

A new property has been added to your config/inertia.ts :

import { defineConfig } from '@adonisjs/inertia'

export default defineConfig({
  rootView: 'app_root',
  assetsVersion: 1,
  ssr: {
    enabled: true,  // 👈👈
  },
})

SSR is now activated and should be working for all your pages. If you need more granularity on what should be rendered in SSR or not, you can use the pages property and specify the components that should be server side rendered :

import { defineConfig } from '@adonisjs/inertia'

export default defineConfig({
  rootView: 'app_root',
  assetsVersion: 1,
  ssr: {
    enabled: true,
    pages: ['home'] // 👈👈
  },
})

I insist on the experimental side of this release. It has not been battle-tested. If you encounter any problems, please report them

What's Changed

New Contributors

Full Changelog: v1.0.0-7...v1.0.0-8

Add `inertia.share` method

16 Jan 18:13

Choose a tag to compare

Add share method

inertia.share lets you share page props before calling the render method. this can be useful for using in middleware for example.

also note that inertia.share is scoped to the current instance and will override globally defined data.

router.get('/foo', ({ inertia }) => {
  inertia.share({ data: 42 })
})

Full Changelog: v1.0.0-3...v1.0.0-7

Add @inertia parameters

21 Nov 23:44

Choose a tag to compare

@inertia tag can now accept multiples parameters :

  • class for setting a class name to the rendered element
  • id for setting an id to the rendered element. Defaults to app
  • as for rendering the element as a specific tag. Defaults to div
@inertia({
  as: 'main',
  class: 'h-full',
  id: 'my-app'
})

Full Changelog: v1.0.0-2...v1.0.0-3

Support for view props

21 Nov 14:51

Choose a tag to compare

  • fix: pin typescript version 60f1c0b
  • feat: add support for view props aa411d0
  • fix: generic interface passed to render 1171fbe
  • chore: add @japa/expect-type a86bab4

Full Changelog: v1.0.0-0...v1.0.0-2

1.0.0-0

15 Nov 23:17

Choose a tag to compare

v1.0.0-0

chore(release): 1.0.0-0