diff --git a/packages/nitro/package.json b/packages/nitro/package.json index 9450350751..0dc678e157 100644 --- a/packages/nitro/package.json +++ b/packages/nitro/package.json @@ -67,7 +67,7 @@ "unstorage": "^0.2.3", "upath": "^2.0.1", "vue": "3.2.9", - "vue-bundle-renderer": "^0.2.10", + "vue-bundle-renderer": "^0.3.0", "vue-server-renderer": "^2.6.14" }, "devDependencies": { diff --git a/packages/nitro/src/runtime/app/render.ts b/packages/nitro/src/runtime/app/render.ts index 3983cfcfbc..98585845f8 100644 --- a/packages/nitro/src/runtime/app/render.ts +++ b/packages/nitro/src/runtime/app/render.ts @@ -21,7 +21,7 @@ const getSSRRenderer = cachedResult(async () => { if (!createSSRApp) { throw new Error('Server bundle is missing') } // Create renderer const { renderToString } = await import('#nitro-renderer') - return createRenderer((createSSRApp), { clientManifest, renderToString }).renderToString + return createRenderer((createSSRApp), { clientManifest, renderToString, publicPath: clientManifest.publicPath || '/_nuxt' }).renderToString }) const getSPARenderer = cachedResult(async () => { diff --git a/packages/vite/src/client.ts b/packages/vite/src/client.ts index c262e8adb9..850586c5b9 100644 --- a/packages/vite/src/client.ts +++ b/packages/vite/src/client.ts @@ -1,11 +1,14 @@ import * as vite from 'vite' import { resolve } from 'upath' -import { mkdirp, writeFile } from 'fs-extra' +import { mkdirp, readJSON, writeFile } from 'fs-extra' +import consola from 'consola' import vitePlugin from '@vitejs/plugin-vue' + import { cacheDirPlugin } from './plugins/cache-dir' import { replace } from './plugins/replace' -import { ViteBuildContext, ViteOptions } from './vite' import { transformNuxtSetup } from './plugins/transformSetup' +import { wpfs } from './utils/wpfs' +import type { ViteBuildContext, ViteOptions } from './vite' export async function buildClient (ctx: ViteBuildContext) { const clientConfig: vite.InlineConfig = vite.mergeConfig(ctx.config, { @@ -21,7 +24,14 @@ export async function buildClient (ctx: ViteBuildContext) { } }, build: { - outDir: 'dist/client', + rollupOptions: { + output: { + chunkFileNames: ctx.nuxt.options.dev ? undefined : '[name]-[hash].mjs', + entryFileNames: ctx.nuxt.options.dev ? 'entry.mjs' : '[name]-[hash].mjs' + } + }, + manifest: true, + outDir: resolve(ctx.nuxt.options.buildDir, 'dist/client'), assetsDir: '.' }, plugins: [ @@ -37,19 +47,6 @@ export async function buildClient (ctx: ViteBuildContext) { await ctx.nuxt.callHook('vite:extendConfig', clientConfig, { isClient: true, isServer: false }) - const clientManifest = { - publicPath: ctx.nuxt.options.build.publicPath, - all: [], - initial: [ctx.nuxt.options.dev && '@vite/client', 'entry.mjs'].filter(Boolean), - async: [], - modules: {} - } - - const serverDist = resolve(ctx.nuxt.options.buildDir, 'dist/server') - await mkdirp(serverDist) - await writeFile(resolve(serverDist, 'client.manifest.json'), JSON.stringify(clientManifest, null, 2), 'utf8') - await writeFile(resolve(serverDist, 'client.manifest.mjs'), 'export default ' + JSON.stringify(clientManifest, null, 2), 'utf8') - const viteServer = await vite.createServer(clientConfig) await ctx.nuxt.callHook('vite:serverCreated', viteServer) @@ -66,4 +63,32 @@ export async function buildClient (ctx: ViteBuildContext) { ctx.nuxt.hook('close', async () => { await viteServer.close() }) + + if (!ctx.nuxt.options.dev) { + const start = Date.now() + await vite.build(clientConfig) + await ctx.nuxt.callHook('build:resources', wpfs) + consola.info(`Client built in ${Date.now() - start}ms`) + } + + // Write client manifest for use in vue-bundle-renderer + const clientDist = resolve(ctx.nuxt.options.buildDir, 'dist/client') + const serverDist = resolve(ctx.nuxt.options.buildDir, 'dist/server') + + // Legacy dev manifest + const devClientManifest = { + publicPath: ctx.nuxt.options.build.publicPath, + all: [], + initial: ['@vite/client', 'entry.mjs'], + async: [], + modules: {} + } + + const clientManifest = ctx.nuxt.options.dev + ? devClientManifest + : await readJSON(resolve(clientDist, 'manifest.json')) + + await mkdirp(serverDist) + await writeFile(resolve(serverDist, 'client.manifest.json'), JSON.stringify(clientManifest, null, 2), 'utf8') + await writeFile(resolve(serverDist, 'client.manifest.mjs'), 'export default ' + JSON.stringify(clientManifest, null, 2), 'utf8') } diff --git a/yarn.lock b/yarn.lock index 5e78131093..be312be8c7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1526,7 +1526,7 @@ __metadata: unstorage: ^0.2.3 upath: ^2.0.1 vue: 3.2.9 - vue-bundle-renderer: ^0.2.10 + vue-bundle-renderer: ^0.3.0 vue-server-renderer: ^2.6.14 languageName: unknown linkType: soft @@ -13783,12 +13783,12 @@ fsevents@~2.3.2: languageName: node linkType: hard -"vue-bundle-renderer@npm:^0.2.10": - version: 0.2.10 - resolution: "vue-bundle-renderer@npm:0.2.10" +"vue-bundle-renderer@npm:^0.3.0": + version: 0.3.0 + resolution: "vue-bundle-renderer@npm:0.3.0" dependencies: bundle-runner: ^0.0.1 - checksum: a1c462deca857f1ce333cf8be72ab24306ba015f33190e00c0b6d5821783668001b1a1c13861e277b7452d625ac7cdf642fa2ceeb8f1d2bedb5e632a1275cede + checksum: 11600caea3afa7f8a4eeeb61c587d6b3558f32184446c3f1f22fade46a2dd94662371f125618c02a40095ae00437dafbabddc07a59b95dee063bf71d255d43ab languageName: node linkType: hard