Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: (v7) Prerendering Fails with React 19 #12138

Closed
abdel-17 opened this issue Oct 17, 2024 · 9 comments · Fixed by #12578
Closed

[Bug]: (v7) Prerendering Fails with React 19 #12138

abdel-17 opened this issue Oct 17, 2024 · 9 comments · Fixed by #12578
Labels
awaiting release This issue have been fixed and will be released soon bug v7

Comments

@abdel-17
Copy link

What version of React Router are you using?

7.0.0-pre.1

Steps to Reproduce

  1. Go to https://stackblitz.com/edit/vitejs-vite-cibu2u?file=app%2Fhome.jsx
  2. Run pnpm build

Expected Behavior

It should build successfully.

Actual Behavior

It fails with a cryptic error likely due to React's internals changing.

@abdel-17 abdel-17 added the bug label Oct 17, 2024
@brophdawg11 brophdawg11 added the v7 label Oct 23, 2024
@mayank99
Copy link

mayank99 commented Dec 6, 2024

This can still be reproduced with the latest stable versions of React and React Router. Updated repro link: https://stackblitz.com/edit/vitejs-vite-wlza4m?file=package.json&terminal=build

Logs
npm run build

> react-router build

vite v6.0.3 building for production...
✓ 41 modules transformed.
build/client/.vite/manifest.json                  1.11 kB │ gzip:  0.32 kB
build/client/assets/home-DMjzBprG.js              0.18 kB │ gzip:  0.17 kB
build/client/assets/with-props-BxDUxdVQ.js        0.44 kB │ gzip:  0.22 kB
build/client/assets/root-Dj_cnf6b.js              0.52 kB │ gzip:  0.32 kB
build/client/assets/chunk-D52XG6IA-CIXPXIh-.js  103.03 kB │ gzip: 34.93 kB
build/client/assets/entry.client-BOCz0HeL.js    179.29 kB │ gzip: 56.87 kB
✓ built in 1.38s
vite v6.0.3 building SSR bundle for production...
✓ 8 modules transformed.
build/server/.vite/manifest.json  0.17 kB
build/server/index.js             5.43 kB

TypeError: dispatcher.getOwner is not a function
	[getOwner@/node_modules/react/cjs/react.development.js#cjs:416:54
	exports.createElement@/node_modules/react/cjs/react.development.js#cjs:1330:61
	getRouteComponents@/node_modules/react-router/dist/development/index.js#cjs:6209:104
	createServerRoutes/<@/node_modules/react-router/dist/development/index.js#cjs:6229:10
	createServerRoutes@/node_modules/react-router/dist/development/index.js#cjs:6222:45
	ServerRouter@/node_modules/react-router/dist/development/index.js#cjs:8215:34


TypeError: dispatcher.getOwner is not a function
	[getOwner@/node_modules/react/cjs/react.development.js#cjs:416:54
	exports.createElement@/node_modules/react/cjs/react.development.js#cjs:1330:61
	getRouteComponents@/node_modules/react-router/dist/development/index.js#cjs:6209:104
	createServerRoutes/<@/node_modules/react-router/dist/development/index.js#cjs:6229:10
	createServerRoutes@/node_modules/react-router/dist/development/index.js#cjs:6222:45
	ServerRouter@/node_modules/react-router/dist/development/index.js#cjs:8215:34


x Build failed in 276ms
[react-router] Prerender: Received a 500 status code from `entry.server.tsx` while prerendering the `/` path.
Unexpected Server Error
    at validatePrerenderedResponse (/node_modules/@react-router/dev/dist/vite.js:2635:11)
    at prerenderRoute (/node_modules/@react-router/dev/dist/vite.js:2599:30) {
  code: 'PLUGIN_ERROR',
  plugin: 'react-router',
  hook: 'writeBundle'
}

@Fredkiss3
Copy link

Fredkiss3 commented Dec 9, 2024

I have found a simple way to fix this issue is to run NODE_ENV=production before building the app like this :

NODE_ENV=production npm run build

It seems like this issue is related to this : #12078

@brookslybrand
Copy link
Contributor

@Fredkiss3 is correct, this is the way to force the proper NODE_ENV for React to build correctly

To be determined if we change how the defaults are setup, so I'll leave this issue open. However, for anyone looking at this issue, this is a proper solution (also true if you have ssr: false set or are using react-router-serve)

@connorjs
Copy link

This also affects ssr: false for SPA builds. I wonder why we even build/generate the server code when we have ssr: false (but that would be a separate issue).

Just mentioning since this issue and linked PR helped me understand and fix.

@brophdawg11 brophdawg11 added the awaiting release This issue have been fixed and will be released soon label Dec 18, 2024
@brophdawg11
Copy link
Contributor

ssr: false disables runtime server rendering. We still need to perform server rendering at build time to generate your index.html file

@brophdawg11
Copy link
Contributor

This should be fixed by #12578 and available in the next release

Copy link
Contributor

🤖 Hello there,

We just published version 7.1.0-pre.0 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

@brophdawg11 brophdawg11 linked a pull request Dec 18, 2024 that will close this issue
Copy link
Contributor

🤖 Hello there,

We just published version 7.1.0 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

@connorjs
Copy link

ssr: false disables runtime server rendering. We still need to perform server rendering at build time to generate your index.html file

@brophdawg11 - I really appreciated this emphasis. I had not shifted my thinking to this given I was still in "client react router" headspace.

Can we add something to https://reactrouter.com/how-to/spa along those lines? I could open an issue/PR if desired.


Separately, awesome to hear about 7.1.0! I will update right away!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
awaiting release This issue have been fixed and will be released soon bug v7
Projects
None yet
6 participants