diff --git a/packages/vite/src/node/build.ts b/packages/vite/src/node/build.ts index 12f123413534a4..6c8e0169eeeab4 100644 --- a/packages/vite/src/node/build.ts +++ b/packages/vite/src/node/build.ts @@ -444,11 +444,13 @@ async function doBuild( ) } - const ssrWorkerBuild = ssr && config.ssr?.target !== 'webworker' - const cjsSsrBuild = ssr && config.ssr?.format === 'cjs' + const ssrNodeBuild = ssr && config.ssr.target === 'node' + const ssrWorkerBuild = ssr && config.ssr.target === 'webworker' + const cjsSsrBuild = ssr && config.ssr.format === 'cjs' + const format = output.format || (cjsSsrBuild ? 'cjs' : 'es') const jsExt = - ssrWorkerBuild || libOptions + ssrNodeBuild || libOptions ? resolveOutputJsExtension(format, getPkgJson(config.root)?.type) : 'js' return { diff --git a/playground/ssr-vue/vite.config.js b/playground/ssr-vue/vite.config.js index c2c90bbc32c4bf..a313ea7dd479b2 100644 --- a/playground/ssr-vue/vite.config.js +++ b/playground/ssr-vue/vite.config.js @@ -85,14 +85,15 @@ export default defineConfig(({ command, ssrBuild }) => ({ } }, transform(code, id) { + const cleanId = cleanUrl(id) if ( config.build.ssr && - cleanUrl(id).endsWith('.js') && + (cleanId.endsWith('.js') || cleanId.endsWith('.vue')) && !code.includes('__ssr_vue_processAssetPath') ) { return { code: - `import { __ssr_vue_processAssetPath } from '${virtualId}';` + + `import { __ssr_vue_processAssetPath } from '${virtualId}';__ssr_vue_processAssetPath;` + code, sourcemap: null // no sourcemap support to speed up CI } diff --git a/playground/ssr-webworker/__tests__/ssr-webworker.spec.ts b/playground/ssr-webworker/__tests__/ssr-webworker.spec.ts index 7a5c1bdad2880e..931e8f7d32199f 100644 --- a/playground/ssr-webworker/__tests__/ssr-webworker.spec.ts +++ b/playground/ssr-webworker/__tests__/ssr-webworker.spec.ts @@ -1,5 +1,5 @@ import { port } from './serve' -import { page } from '~utils' +import { findAssetFile, isBuild, page } from '~utils' const url = `http://localhost:${port}` @@ -9,3 +9,8 @@ test('/', async () => { expect(await page.textContent('.linked')).toMatch('dep from upper directory') expect(await page.textContent('.external')).toMatch('object') }) + +test.runIf(isBuild)('inlineDynamicImports', () => { + const dynamicJsContent = findAssetFile(/dynamic\.\w+\.js/, 'worker') + expect(dynamicJsContent).toBe('') +}) diff --git a/playground/ssr-webworker/src/dynamic.js b/playground/ssr-webworker/src/dynamic.js new file mode 100644 index 00000000000000..cb356468240d50 --- /dev/null +++ b/playground/ssr-webworker/src/dynamic.js @@ -0,0 +1 @@ +export const foo = 'foo' diff --git a/playground/ssr-webworker/src/entry-worker.jsx b/playground/ssr-webworker/src/entry-worker.jsx index c885657b18a6d3..940d0d2943d632 100644 --- a/playground/ssr-webworker/src/entry-worker.jsx +++ b/playground/ssr-webworker/src/entry-worker.jsx @@ -1,6 +1,10 @@ import { msg as linkedMsg } from 'resolve-linked' import React from 'react' +import('./dynamic').then(({ foo }) => { + console.log(foo) +}) + addEventListener('fetch', function (event) { return event.respondWith( new Response( diff --git a/playground/test-utils.ts b/playground/test-utils.ts index a0fedd0db426d6..17e4517df43776 100644 --- a/playground/test-utils.ts +++ b/playground/test-utils.ts @@ -1,4 +1,3 @@ -/* eslint-disable @typescript-eslint/triple-slash-reference */ // test utils used in e2e tests for playgrounds. // `import { getColor } from '~utils'` @@ -8,7 +7,7 @@ import fs from 'node:fs' import path from 'node:path' import colors from 'css-color-names' -import type { ElementHandle, ConsoleMessage } from 'playwright-chromium' +import type { ConsoleMessage, ElementHandle } from 'playwright-chromium' import type { Manifest } from 'vite' import { normalizePath } from 'vite' import { fromComment } from 'convert-source-map' @@ -128,7 +127,15 @@ export function findAssetFile( assets = 'assets' ): string { const assetsDir = path.join(testDir, 'dist', base, assets) - const files = fs.readdirSync(assetsDir) + let files: string[] + try { + files = fs.readdirSync(assetsDir) + } catch (e) { + if (e.code === 'ENOENT') { + return '' + } + throw e + } const file = files.find((file) => { return file.match(match) })