inertia-adonisjs 8.0.0 is not working, 7.4.0 is working

[jitterbux]

It kind of feels like everything is broken, the code and the docs for the version 8. Should we go back to 7.4.0?
Or do you think you will fix it in a week or two?
Especially the SSR seems not to be working at all - all kinds of errors, don't want to know where to start mentioning them ;D.
Perhaps a working Vue example project would help - it's so hard to find any documentation for Adonis and Inertia 1.0 with SSR that works. Well, I haven't found any so far.

[eidellev]

Hey @jitterbux
Thanks for the feedback. Can you please elaborate on what stopped working for you?
A sample project would be best, but a stack trace is also good.

Keep 2 things in mind though:

1. Version 8 is designed to work with inertia V1 and there had been some breaking changes on both ends.
2. Since V1 all inertia packages use ESM instead of CJS (import X from 'Y' vs const X = require('Y')) . You will need to adjust your webpack/encore/vite config accordingly.

[jitterbux]

Yeah, I am stuck at this error message: Instead rename index.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules so I am not sure how to fix it. It points to this line: module.exports = require("@inertiajs/vue3"); in ssr.js. So, I need to change it to import { } from "@inertiajs/vue3"; ? Sorry, I am bad with JavaScript.

[jitterbux]

Were you able to make your Adonis project work with Inertia 1.0 and especially SSR? Could you please share such project on Github. Perhaps I and others could study and compare the code file by file (or use it as a starter project after cloning) and it will be even better for you not to explain all the things over and over. Because I can't find a working example of Adonis and Inertia 1.0 with SSR. It would be cool if you could create some repo with the basic working example of Adonis and Inertia with SSR, preferably using Vue ;) Just something very basic, one route and one page. Thank you a lot in advance.

[mastermunj]

@jitterbux Please try updating webpack.ssr.config.js as follows:

const nodeExternals = require('webpack-node-externals');

Then replace

config.externals = [require('webpack-node-externals')()]

with

config.externals = [
  nodeExternals({
    allowlist: ['@inertiajs/core', '@inertiajs/vue3'],
  }),
];

This solved the problem for me.

[Quent1Pr]

Thank you @mastermunj I had the same issue but after that I have this error "Cannot use import statement outside a module" (with react)

@eidellev I agree with @jitterbux It's hard to find a working example with ssr ! I saw @RomainLanz trying it on Youtube.

[RomainLanz]

I have made it work with Vue and React. I will check if I can improve the readme, but I don't recall having any issues with this package.

The only thing to consider is that you should not use Inertia 1.0 yet.

[ammezie]

@RomainLanz curious as to why Inertia 1.0 shouldn't be used yet? I thought it's a stable release.

[RomainLanz]

Because this package has not been updated for it yet. No issue with Inertia 1.0 directly 😄

[ammezie]

Oh! Makes sense.

[brlebtag]

I have made it work with Vue and React. I will check if I can improve the readme, but I don't recall having any issues with this package.

The only thing to consider is that you should not use Inertia 1.0 yet.

Could you share a "how to"? I am trying to use Adonis + SSR + React but I have not succeeded so far.

[RomainLanz]

Could you share a "how to"? I am trying to use Adonis + SSR + React but I have not succeeded so far.

If you want to enable SSR, you have to use version 7.4.0 of this package, and you must code your frontend in CJS.

Using the latest version will move your frontend code to ESM. Doing so will require to also have an ESM backend to render your components/pages, and this is not the case with AdonisJS 5.

TL;DR: If you want to do SSR with AdonisJS 5 and Inertia, use version 7.4.0 and code in CJS.