SSR external doesn't work with resolve.alias #19461

Jinjiang · 2025-02-18T09:44:35Z

Describe the bug

When setting a package alias (for example react) to its root dir like:

{
  resolve: [
    { find: 'react', replacement: '/<repo>/node_modules/.pnpm/[email protected]/node_modules/react' }
  ]
}

in SSR mode, it will cause an error like:

Server running on http://localhost:3000
4:43:15 PM [vite] (ssr) Error when evaluating SSR module ./root-server.tsx: module is not defined
      at eval (/<repo>/node_modules/.pnpm/[email protected]/node_modules/react/jsx-dev-runtime.js:8:3)
      at ESModulesEvaluator.runInlinedModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1057:6)
      at SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1271:82)
      at SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30895:35)
      at SSRCompatModuleRunner.cachedRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1166:28)
      at request (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1215:79)
      at async eval (/<repo>/root-server.tsx:3:44)
      at async ESModulesEvaluator.runInlinedModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1049:5)
      at async SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1271:61)
      at async SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30895:23)
      at async SSRCompatModuleRunner.cachedRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1167:76)
      at async SSRCompatModuleRunner.import (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1104:12)
      at async instantiateModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30852:12)
      at async file:///<repo>/server.mjs:55:26

I roughly debugged into vite source code and found the fetchModule() didn't handle the alias very well when deciding whether it's an external resource in SSR mode:

without react alias:

[fetchModule] { url: './root-server.tsx', importer: undefined }
[fetchModule] {
  url: 'react/jsx-dev-runtime',
  importer: '/<repo>/root-server.tsx'
}
[fetchModule] {
  url: 'react-dom/server',
  importer: '/<repo>/root-server.tsx'
}
[fetchModule] { url: './root-server.tsx', importer: undefined }

with react alias:

[fetchModule] { url: './root-server.tsx', importer: undefined }
[fetchModule] {
  url: '/node_modules/.pnpm/[email protected]/node_modules/react/jsx-dev-runtime.js',
  importer: '/<repo>/root-server.tsx'
}

5:35:19 PM [vite] (ssr) Error when evaluating SSR module ./root-server.tsx: module is not defined
      at eval (/<repo>/node_modules/.pnpm/[email protected]/node_modules/react/jsx-dev-runtime.js:8:3)
      at ESModulesEvaluator.runInlinedModule (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:3911:11)
      at SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4200:26)
      at SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4524:36)
      at SSRCompatModuleRunner.cachedRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4054:28)
      at request (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4124:19)
      at async eval (/<repo>/root-server.tsx:3:44)
      at async ESModulesEvaluator.runInlinedModule (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:3911:5)
      at async SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4200:5)
      at async SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4524:24)
      at async SSRCompatModuleRunner.cachedRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4057:33)
      at async SSRCompatModuleRunner.import (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:3972:12)
      at async instantiateModule (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4481:12)
      at async file:///<repo>/server.mjs:55:26

Reproduction

https://github.com/Jinjiang/reproductions/tree/try-vite-ssr-20250213

Steps to reproduce

How to reproduce:

Open server.mjs and add below into resolve.alias config:

const devServer = await createServer({
  ...
  resolve: {
    alias: [
      {
        find: "react",
        replacement: reactRoot,
      }
    ],
  },
  ...
});

Then:
```
pnpm install
pnpm dev
```

Open http://localhost:3000 in browser.

error log:

Server running on http://localhost:3000
4:43:15 PM [vite] (ssr) Error when evaluating SSR module ./root-server.tsx: module is not defined
      at eval (/<repo>/node_modules/.pnpm/[email protected]/node_modules/react/jsx-dev-runtime.js:8:3)
      at ESModulesEvaluator.runInlinedModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1057:6)
      at SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1271:82)
      at SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30895:35)
      at SSRCompatModuleRunner.cachedRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1166:28)
      at request (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1215:79)
      at async eval (/<repo>/root-server.tsx:3:44)
      at async ESModulesEvaluator.runInlinedModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1049:5)
      at async SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1271:61)
      at async SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30895:23)
      at async SSRCompatModuleRunner.cachedRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1167:76)
      at async SSRCompatModuleRunner.import (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1104:12)
      at async instantiateModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30852:12)
      at async file:///<repo>/server.mjs:55:26

System Info

System:
    OS: macOS 15.3.1
    CPU: (8) arm64 Apple M1
    Memory: 88.69 MB / 8.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.17.0 - ~/.local/share/mise/installs/node/20/bin/node
    Yarn: 1.22.18 - ~/.yarn/bin/yarn
    npm: 11.0.0 - ~/.local/share/mise/installs/node/20/bin/npm
    pnpm: 9.15.4 - ~/Library/pnpm/pnpm
    bun: 1.1.36 - ~/.local/share/mise/installs/bun/latest/bin/bun
  Browsers:
    Safari: 18.3
  npmPackages:
    @vitejs/plugin-react: ^4.3.4 => 4.3.4 
    vite: ^6.1.0 => 6.1.0

Used Package Manager

pnpm

Logs

error log:

Server running on http://localhost:3000
4:43:15 PM [vite] (ssr) Error when evaluating SSR module ./root-server.tsx: module is not defined
      at eval (/<repo>/node_modules/.pnpm/[email protected]/node_modules/react/jsx-dev-runtime.js:8:3)
      at ESModulesEvaluator.runInlinedModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1057:6)
      at SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1271:82)
      at SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30895:35)
      at SSRCompatModuleRunner.cachedRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1166:28)
      at request (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1215:79)
      at async eval (/<repo>/root-server.tsx:3:44)
      at async ESModulesEvaluator.runInlinedModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1049:5)
      at async SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1271:61)
      at async SSRCompatModuleRunner.directRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30895:23)
      at async SSRCompatModuleRunner.cachedRequest (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1167:76)
      at async SSRCompatModuleRunner.import (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/module-runner.js:1104:12)
      at async instantiateModule (file:///<repo>/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-CfG9u7Cn.js:30852:12)
      at async file:///<repo>/server.mjs:55:26

fetchModule without react alias:

[fetchModule] { url: './root-server.tsx', importer: undefined }
[fetchModule] {
  url: 'react/jsx-dev-runtime',
  importer: '/<repo>/root-server.tsx'
}
[fetchModule] {
  url: 'react-dom/server',
  importer: '/<repo>/root-server.tsx'
}
[fetchModule] { url: './root-server.tsx', importer: undefined }

fetchModule with react alias:

[fetchModule] { url: './root-server.tsx', importer: undefined }
[fetchModule] {
  url: '/node_modules/.pnpm/[email protected]/node_modules/react/jsx-dev-runtime.js',
  importer: '/<repo>/root-server.tsx'
}

5:35:19 PM [vite] (ssr) Error when evaluating SSR module ./root-server.tsx: module is not defined
      at eval (/<repo>/node_modules/.pnpm/[email protected]/node_modules/react/jsx-dev-runtime.js:8:3)
      at ESModulesEvaluator.runInlinedModule (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:3911:11)
      at SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4200:26)
      at SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4524:36)
      at SSRCompatModuleRunner.cachedRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4054:28)
      at request (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4124:19)
      at async eval (/<repo>/root-server.tsx:3:44)
      at async ESModulesEvaluator.runInlinedModule (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:3911:5)
      at async SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4200:5)
      at async SSRCompatModuleRunner.directRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4524:24)
      at async SSRCompatModuleRunner.cachedRequest (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4057:33)
      at async SSRCompatModuleRunner.import (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:3972:12)
      at async instantiateModule (file:///<vite>/dist/node/_chunk-4PQHSIBL.js:4481:12)
      at async file:///<repo>/server.mjs:55:26

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.

The text was updated successfully, but these errors were encountered:

hi-ogawa · 2025-02-19T00:44:41Z

For now, this is how alias is designed to work and the behavior is same between Vite 5 and Vite 6. Without alias, import "react" is not transformed by vite's import analysis and later fetchModule resolves as external for module runner execution. With alias, import "react" is replaced with alias during import analysis and fetchModule treat it as "non external".

Jinjiang · 2025-02-21T07:13:01Z

I see. Then based on the alias setting, what config can make it external?

Jinjiang · 2025-02-21T07:16:42Z

And BTW, why react needs to be external? I didn't find any relevant docs explaining that.

Jinjiang added the pending triage label Feb 18, 2025

hi-ogawa added the feat: ssr label Feb 19, 2025

Jinjiang mentioned this issue Feb 21, 2025

ssr.resolve.dedupe not fully resolve all the (cjs) packages #19463

Open

7 tasks

virtualzx-nad mentioned this issue Mar 1, 2025

Fix SSR external resolution with resolve.alias augment-test-org/vite#2

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

SSR external doesn't work with resolve.alias #19461

SSR external doesn't work with resolve.alias #19461

Jinjiang commented Feb 18, 2025

hi-ogawa commented Feb 19, 2025

Jinjiang commented Feb 21, 2025

Jinjiang commented Feb 21, 2025

SSR external doesn't work with resolve.alias #19461

SSR external doesn't work with resolve.alias #19461

Comments

Jinjiang commented Feb 18, 2025

Describe the bug

Reproduction

Steps to reproduce

System Info

Used Package Manager

Logs

Validations

hi-ogawa commented Feb 19, 2025

Jinjiang commented Feb 21, 2025

Jinjiang commented Feb 21, 2025