fix(ssr): externalize network imports during ssrLoadModule (#15599)

.prettierignore

@@ -9,3 +9,4 @@ playground/tsconfig-json-load-error/has-error/tsconfig.json
 playground/html/invalid.html
 playground/html/valid.html
 playground/external/public/slash@3.0.0.js
+playground/ssr-html/public/slash@3.0.0.js

packages/vite/src/node/ssr/ssrModuleLoader.ts

@@ -2,7 +2,7 @@ import path from 'node:path'
 import { pathToFileURL } from 'node:url'
 import colors from 'picocolors'
 import type { ViteDevServer } from '../server'
-import { isBuiltin, isFilePathESM, unwrapId } from '../utils'
+import { isBuiltin, isExternalUrl, isFilePathESM, unwrapId } from '../utils'
 import { transformRequest } from '../server/transformRequest'
 import type { InternalResolveOptionsWithOverrideConditions } from '../plugins/resolve'
 import { tryNodeResolve } from '../plugins/resolve'
@@ -292,7 +292,7 @@ async function nodeImport(
 ) {
   let url: string
   let filePath: string | undefined
-  if (id.startsWith('data:') || isBuiltin(id)) {
+  if (id.startsWith('data:') || isExternalUrl(id) || isBuiltin(id)) {
     url = id
   } else {
     const resolved = tryNodeResolve(

playground/ssr-html/__tests__/ssr-html.spec.ts

@@ -1,6 +1,7 @@
 import { execFile } from 'node:child_process'
 import { promisify } from 'node:util'
 import path from 'node:path'
+import { fileURLToPath } from 'node:url'
 import fetch from 'node-fetch'
 import { describe, expect, test } from 'vitest'
 import { port } from './serve'
@@ -62,9 +63,9 @@ describe.runIf(isServe)('hmr', () => {
   })
 })
 
-describe.runIf(isServe)('stacktrace', () => {
-  const execFileAsync = promisify(execFile)
+const execFileAsync = promisify(execFile)
 
+describe.runIf(isServe)('stacktrace', () => {
   for (const ext of ['js', 'ts']) {
     for (const sourcemapsEnabled of [false, true]) {
       test(`stacktrace of ${ext} is correct when sourcemaps is${
@@ -98,3 +99,13 @@ describe.runIf(isServe)('stacktrace', () => {
     }
   }
 })
+
+test.runIf(isServe)('network-imports', async () => {
+  await execFileAsync(
+    'node',
+    ['--experimental-network-imports', 'test-network-imports.js'],
+    {
+      cwd: fileURLToPath(new URL('..', import.meta.url)),
+    },
+  )
+})

playground/ssr-html/src/network-imports.js

@@ -0,0 +1,7 @@
+// same port as `ports["ssr-html"]` in playground/test-utils.ts
+import slash from 'http://localhost:9602/slash@3.0.0.js'
+
+// or test without local server
+// import slash from 'https://esm.sh/slash@3.0.0'
+
+export { slash }

playground/ssr-html/test-network-imports.js

@@ -0,0 +1,18 @@
+import assert from 'node:assert'
+import { fileURLToPath } from 'node:url'
+import { createServer } from 'vite'
+
+async function runTest() {
+  const server = await createServer({
+    configFile: false,
+    root: fileURLToPath(new URL('.', import.meta.url)),
+    server: {
+      middlewareMode: true,
+    },
+  })
+  const mod = await server.ssrLoadModule('/src/network-imports.js')
+  assert.equal(mod.slash('foo\\bar'), 'foo/bar')
+  await server.close()
+}
+
+runTest()