-
-
Notifications
You must be signed in to change notification settings - Fork 6k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(ssr): preserve require for external node (#11057)
- Loading branch information
1 parent
23d79b8
commit 1ec0176
Showing
16 changed files
with
290 additions
and
72 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
// this is automatically detected by playground/vitestSetup.ts and will replace | ||
// the default e2e test serve behavior | ||
|
||
import path from 'node:path' | ||
import kill from 'kill-port' | ||
import { hmrPorts, isBuild, ports, rootDir } from '~utils' | ||
|
||
export const port = ports['ssr-noexternal'] | ||
|
||
export async function serve(): Promise<{ close(): Promise<void> }> { | ||
if (isBuild) { | ||
// build first | ||
const { build } = await import('vite') | ||
// server build | ||
await build({ | ||
root: rootDir, | ||
logLevel: 'silent', | ||
build: { | ||
ssr: 'src/entry-server.js' | ||
} | ||
}) | ||
} | ||
|
||
await kill(port) | ||
|
||
const { createServer } = await import(path.resolve(rootDir, 'server.js')) | ||
const { app, vite } = await createServer( | ||
rootDir, | ||
isBuild, | ||
hmrPorts['ssr-noexternal'] | ||
) | ||
|
||
return new Promise((resolve, reject) => { | ||
try { | ||
const server = app.listen(port, () => { | ||
resolve({ | ||
// for test teardown | ||
async close() { | ||
await new Promise((resolve) => { | ||
server.close(resolve) | ||
}) | ||
if (vite) { | ||
await vite.close() | ||
} | ||
} | ||
}) | ||
}) | ||
} catch (e) { | ||
reject(e) | ||
} | ||
}) | ||
} |
10 changes: 10 additions & 0 deletions
10
playground/ssr-noexternal/__tests__/ssr-noexternal.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
import { expect, test } from 'vitest' | ||
import { port } from './serve' | ||
import { page } from '~utils' | ||
|
||
const url = `http://localhost:${port}` | ||
|
||
test('message from require-external-cjs', async () => { | ||
await page.goto(url) | ||
expect(await page.textContent('.require-external-cjs')).toMatch('foo') | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
throw new Error('shouldnt be loaded') |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
{ | ||
"name": "@vitejs/external-cjs", | ||
"private": true, | ||
"version": "0.0.0", | ||
"exports": { | ||
"require": "./require.cjs", | ||
"import": "./import.mjs" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
module.exports = 'foo' |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<title>Vite App</title> | ||
</head> | ||
<body> | ||
<div id="app"><!--app-html--></div> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
{ | ||
"name": "@vitejs/test-ssr-noexternal", | ||
"private": true, | ||
"version": "0.0.0", | ||
"type": "module", | ||
"scripts": { | ||
"dev": "node server", | ||
"build": "vite build --ssr src/entry-server.js", | ||
"serve": "NODE_ENV=production node server", | ||
"debug": "node --inspect-brk server" | ||
}, | ||
"dependencies": { | ||
"@vitejs/external-cjs": "file:./external-cjs", | ||
"@vitejs/require-external-cjs": "file:./require-external-cjs", | ||
"express": "^4.18.2" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
module.exports = require('@vitejs/external-cjs') |
10 changes: 10 additions & 0 deletions
10
playground/ssr-noexternal/require-external-cjs/package.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
{ | ||
"name": "@vitejs/require-external-cjs", | ||
"type": "commonjs", | ||
"private": true, | ||
"version": "0.0.0", | ||
"main": "main.js", | ||
"dependencies": { | ||
"@vitejs/external-cjs": "file:../external-cjs" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,87 @@ | ||
import fs from 'node:fs' | ||
import path from 'node:path' | ||
import { fileURLToPath } from 'node:url' | ||
import express from 'express' | ||
|
||
const __dirname = path.dirname(fileURLToPath(import.meta.url)) | ||
|
||
const isTest = process.env.VITEST | ||
|
||
export async function createServer( | ||
root = process.cwd(), | ||
isProd = process.env.NODE_ENV === 'production', | ||
hmrPort | ||
) { | ||
const resolve = (p) => path.resolve(__dirname, p) | ||
|
||
const indexProd = isProd | ||
? fs.readFileSync(resolve('index.html'), 'utf-8') | ||
: '' | ||
|
||
const app = express() | ||
|
||
/** | ||
* @type {import('vite').ViteDevServer} | ||
*/ | ||
let vite | ||
if (!isProd) { | ||
vite = await ( | ||
await import('vite') | ||
).createServer({ | ||
root, | ||
logLevel: isTest ? 'error' : 'info', | ||
server: { | ||
middlewareMode: true, | ||
watch: { | ||
// During tests we edit the files too fast and sometimes chokidar | ||
// misses change events, so enforce polling for consistency | ||
usePolling: true, | ||
interval: 100 | ||
}, | ||
hmr: { | ||
port: hmrPort | ||
} | ||
}, | ||
appType: 'custom' | ||
}) | ||
app.use(vite.middlewares) | ||
} | ||
|
||
app.use('*', async (req, res) => { | ||
try { | ||
const url = req.originalUrl | ||
|
||
let template, render | ||
if (!isProd) { | ||
// always read fresh template in dev | ||
template = fs.readFileSync(resolve('index.html'), 'utf-8') | ||
template = await vite.transformIndexHtml(url, template) | ||
render = (await vite.ssrLoadModule('/src/entry-server.js')).render | ||
} else { | ||
template = indexProd | ||
// @ts-ignore | ||
render = (await import('./dist/entry-server.js')).render | ||
} | ||
|
||
const appHtml = await render(url) | ||
|
||
const html = template.replace(`<!--app-html-->`, appHtml) | ||
|
||
res.status(200).set({ 'Content-Type': 'text/html' }).end(html) | ||
} catch (e) { | ||
!isProd && vite.ssrFixStacktrace(e) | ||
console.log(e.stack) | ||
res.status(500).end(e.stack) | ||
} | ||
}) | ||
|
||
return { app, vite } | ||
} | ||
|
||
if (!isTest) { | ||
createServer().then(({ app }) => | ||
app.listen(5173, () => { | ||
console.log('http://localhost:5173') | ||
}) | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
import requireExternalCjs from '@vitejs/require-external-cjs' | ||
|
||
export async function render(url) { | ||
let html = '' | ||
|
||
html += `\n<p class="require-external-cjs">message from require-external-cjs: ${requireExternalCjs}</p>` | ||
|
||
return html + '\n' | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import module from 'node:module' | ||
import { defineConfig } from 'vite' | ||
|
||
export default defineConfig({ | ||
ssr: { | ||
noExternal: ['@vitejs/require-external-cjs'], | ||
external: ['@vitejs/external-cjs'], | ||
optimizeDeps: { | ||
disabled: false | ||
} | ||
}, | ||
build: { | ||
target: 'esnext', | ||
minify: false, | ||
rollupOptions: { | ||
external: ['@vitejs/external-cjs'] | ||
}, | ||
commonjsOptions: { | ||
include: [] | ||
} | ||
} | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.