feat(dev-server): leverage vite error handling

marbemac commented 10 months ago

TODO

Requires https://github.com/honojs/node-server/pull/131.

[x] de-yalc @hono/node-server once a new version with the custom error handler option is published

This PR adjusts the dev server so that it passes errors / unexpected conditions through to Vite. This allows us to take advantage of the standard Vite error overlays, stack traces, etc.

Before

After

Or if an error object is returned from the hono endpoint, stack trace is included.:

This is really helpful when rendering client apps in order to get the original stack trace and nice overlay for SSR errors, for example:

/**
 * The frontend app
 */
honoApp.get('*', async c => {
  try {
    // react, solid, etc
    const app = await renderClientApp(<App />);

    return new Response(app, { headers: { 'Content-Type': 'text/html' } });
  } catch (err: any) {
    // in dev, pass the error back to the vite dev server to display in the error overlay
    if (import.meta.env.DEV) return err;

    throw err;
  }
});