got an error when I try to use react

[usualoma]

What version of HonoX are you using?

0.1.0

What steps can reproduce the bug?

Follow the example below to set up react and run npm run dev. https://github.com/honojs/honox?tab=readme-ov-file#byor---bring-your-own-renderer

What is the expected behavior?

no error

What do you see instead?

[vite] Internal server error: module is not defined
      at eval (/.../node_modules/react/jsx-dev-runtime.js:8:3)
      at instantiateModule (file:///.../node_modules/vite/dist/node/chunks/dep-stQc5rCc.js:54696:15)

Additional information

The following changes were made to avoid this

diff --git a/src/vite/index.ts b/src/vite/index.ts
index 2318e86..e9bd409 100644
--- a/src/vite/index.ts
+++ b/src/vite/index.ts
@@ -47,7 +47,7 @@ function honox(options?: Options): PluginOption[] {
       config: () => {
         return {
           ssr: {
-            noExternal: true,
+            noExternal: ['honox'],
           },
         }
       },

[yusukebe]

Hi @usualoma !

This is related to #43.

React is provided as CommonJS, so it cannot be run as-is in Vite. Therefore, you need to specify it in ssr.external as follows.

export default defineConfig(({ mode }) => {
  return {
    ssr: {
      external: ['react', 'react-dom']
    },
    plugins: [honox()]
  }
})

[yusukebe]

@usualoma

This is an example project using React!

https://github.com/yusukebe/honox-playground/tree/main/projects/react

[usualoma]

@yusukebe Thank you. I got it!