Astro Info
Astro v6.1.8
Vite v7.3.2
Node v22.22.1
System macOS (arm64)
Package Manager pnpm
Output static
Adapter @astrojs/cloudflare (v13.1.10)
Integrations @astrojs/react (v5.0.3)
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
On the dev server, the combination of @astrojs/cloudflare adapter + @astrojs/react + Astro Actions + a React island corrupts the Vite client environment's dep optimizer.
node_modules/.vite/deps/_metadata.json ends up containing only astro/actions/runtime/entrypoints/route.js. As a result, @astrojs/react/dist/client.js imports react-dom/client directly from raw pnpm CJS, which throws SyntaxError: does not provide an export named 'createRoot' in the browser at hydrate time.
The bug reproduces only when all four of the following are present — removing any one of them makes the bug disappear:
adapter: cloudflare(...) active in dev
integrations: [react()]
src/actions/index.ts exports at least one defineAction
- At least one React island with
client:*
A detailed investigation (including the Vite-side trace that pinpoints the trigger in astro:integration-container's buildStart hook, a possible fix direction, and a user-side interim workaround) is written up in the reproducer README: https://github.com/aka9232/astro6-cf-react-dev-repro#root-cause
Related: vitejs/vite#19323 covers similar territory but is scoped to SSR environments; the client-env variant here is not covered.
What's the expected result?
The React island should hydrate without error. react-dom/client should be served from node_modules/.vite/deps/ (pre-bundled as an ESM wrapper), the same way it is when any of the four conditions above is absent.
Link to Minimal Reproducible Example
https://github.com/aka9232/astro6-cf-react-dev-repro
Participation
Astro Info
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
On the dev server, the combination of
@astrojs/cloudflareadapter +@astrojs/react+ Astro Actions + a React island corrupts the Vite client environment's dep optimizer.node_modules/.vite/deps/_metadata.jsonends up containing onlyastro/actions/runtime/entrypoints/route.js. As a result,@astrojs/react/dist/client.jsimportsreact-dom/clientdirectly from raw pnpm CJS, which throwsSyntaxError: does not provide an export named 'createRoot'in the browser at hydrate time.The bug reproduces only when all four of the following are present — removing any one of them makes the bug disappear:
adapter: cloudflare(...)active in devintegrations: [react()]src/actions/index.tsexports at least onedefineActionclient:*A detailed investigation (including the Vite-side trace that pinpoints the trigger in
astro:integration-container'sbuildStarthook, a possible fix direction, and a user-side interim workaround) is written up in the reproducer README: https://github.com/aka9232/astro6-cf-react-dev-repro#root-causeRelated: vitejs/vite#19323 covers similar territory but is scoped to SSR environments; the client-env variant here is not covered.
What's the expected result?
The React island should hydrate without error.
react-dom/clientshould be served fromnode_modules/.vite/deps/(pre-bundled as an ESM wrapper), the same way it is when any of the four conditions above is absent.Link to Minimal Reproducible Example
https://github.com/aka9232/astro6-cf-react-dev-repro
Participation