Improve HMR during development

[jarle]

Right now the server restarts on code changes, which is a bit slow for small UI tweaks.

The useful Remix guide for "manual mode" can help for proper HMR: https://remix.run/docs/en/main/guides/manual-mode

[Julien-R44]

I'm not sure I fully understand the issue here: I'd have to try, or maybe you could describe a little more

but, I just wanted to say, Hot-Hook could probably help a lot here: https://github.com/Julien-R44/hot-hook

You can read this article which talks a bit about it: https://feat-hmr-post.adonisjs-com.pages.dev/blog/hmr-in-adonisjs ( Not out yet, but very soon, PRs are about to be merged )

TLDR: we had the same problem with AdonisJS + TSX as a template engine : server had to restart even for a simple padding change, and it was slow. Hot Hook solved that perfectly

[jarle]

That’s awesome, hot hook seems to be the perfect solution for this! 🙌 For HMR to work with remix I basically needed a way to bust the server-side module cache as they do in their examples. I will look into integrating this when I have time.

[jarle]

I've added this in https://github.com/jarle/remix-adonisjs/pull/35 now

Remix actually has their own HMR through virtual modules so I use a combination of this with Hot Hook for the AdonisJS HMR. From their documentation:

// handle SSR requests
app.all(
  "*",
  createRequestHandler({
    build: viteDevServer
      ? () =>
          viteDevServer.ssrLoadModule(
            "virtual:remix/server-build"
          )
      : await import("./build/server/index.js"),
  })
);

I also found that there were seemingly some conflicts happening with Vite, creating many vite.config.ts.timestamp-files, so I had to add that to the hot hook ignore block.