Common Issues

Npm packages containing invalid code

Vite purposely doesn't transpile server-side code but lets your Node.js server directly execute npm packages (in order to improve DX speed).

But some npm packages contain invalid JavaScript code and you need to add them to vite.config.js > ssr.noExternal, see Broken npm package > Solution.

Hydration mismatch

A recurring problem when doing SSR are so-called hydration mismatches: a hydration mismatch is when the content rendered to HTML on the server isn't the same as the content rendered in the browser.

See deep dive explanation and solution at Hydration Mismatch.