Updating from vite 4.1.4 to 4.2.0 broke my build - "Internal server error: window is not defined"

[Spenhouet]

Describe the bug

My app is a Svelte app which is build as static page. After the update from 4.1.4 to 4.2.0 the build is broken.

The release notes of 4.2.0 do not seem to contain any migration guide. Which suggest to me that this update breaking anything is not expected?

Reproduction

https://github.com/bcked/bcked.com/tree/981359b70c2a64e965408ba9f16908812be10a7b

Steps to reproduce

• Run `npm install``
• Run npm run dev -> this should work
• Exit
• Run npm update --save vite
• Run npm run dev -> this now fails with the below exception

System Info

System:
    OS: Linux 5.10 Ubuntu 20.04.5 LTS (Focal Fossa)
    CPU: (16) x64 12th Gen Intel(R) Core(TM) i5-12600K
    Memory: 13.39 GB / 15.50 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 16.15.0 - ~/.nvm/versions/node/v16.15.0/bin/node
    npm: 9.2.0 - ~/.nvm/versions/node/v16.15.0/bin/npm
  npmPackages:
    vite: ^4.2.0 => 4.2.0

Used Package Manager

npm

Logs

After only performing this update (not other package was updated), suddenly my build throws the following error.

Click to expand!

5:37:27 PM [vite-plugin-svelte] ssr compile in progress ...
5:37:28 PM [vite] Error when evaluating SSR module /src/routes/(app)/sections/intro.svelte: failed to import "3d-force-graph"

5:37:28 PM [vite] Error when evaluating SSR module /src/routes/(app)/+page.svelte:

Internal server error: window is not defined
      at file:///home/spe/backed/node_modules/three-forcegraph/dist/three-forcegraph.mjs:416:15
      at ModuleJob.run (node:internal/modules/esm/module_job:198:25)
      at async Promise.all (index 0)
      at async ESMLoader.import (node:internal/modules/esm/loader:385:24)
      at async nodeImport (file:///home/spe/backed/node_modules/vite/dist/node/chunks/dep-c167897e.js:54024:21)
      at async eval (/src/routes/(app)/sections/intro.svelte:15:31)
      at async instantiateModule (file:///home/spe/backed/node_modules/vite/dist/node/chunks/dep-c167897e.js:53981:9)
ReferenceError: window is not defined
    at file:///home/spe/backed/node_modules/three-forcegraph/dist/three-forcegraph.mjs:416:15
    at ModuleJob.run (node:internal/modules/esm/module_job:198:25)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:385:24)
    at async nodeImport (file:///home/spe/backed/node_modules/vite/dist/node/chunks/dep-c167897e.js:54024:21)
    at async eval (/src/routes/(app)/sections/intro.svelte:15:31)
    at async instantiateModule (file:///home/spe/backed/node_modules/vite/dist/node/chunks/dep-c167897e.js:53981:9)

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[fi3ework]

Related to #12324. The package three-forcegraph and three-render-objects aren't compatible with SSR. Considering move 3d-force-graph to client only.

[bluwy]

Yeah. The error has always been there, but Vite was incorrectly suppressing it before, which is fixed in Vite 4.2. I'd suggest following fi3ework's solution since I don't think we want to fix this now.

[Spenhouet]

Hi @fi3ework, the code is already in a client side only block but I think it's already failing on the import. I will take another look if imports can somehow moved to client side only code.

Edit:
Short Google search suggests client side only imports should be doable: https://stackoverflow.com/a/63502144

[Spenhouet]

Yeah. The error has always been there, but Vite was incorrectly suppressing it before, which is fixed in Vite 4.2. I'd suggest following fi3ework's solution since I don't think we want to fix this now.

@bluwy Might be worth a note/warning in the release notes? This took me by surprise and much longer than I would have liked since there was no information to go by.

[bluwy]

It is noted at

vite/packages/vite/CHANGELOG.md

Line 78 in f997882

* fix: throw ssr import error directly (fix #12322) (#12324) ([21ffc6a](https://github.com/vitejs/vite/commit/21ffc6a)), closes [#12322](https://github.com/vitejs/vite/issues/12322) [#12324](https://github.com/vitejs/vite/issues/12324)

[Spenhouet]

That's not sufficient imo. Could be more explicit. I'm probably not the only one this will effect.