diff --git a/playground/ssr-vue/vite.config.js b/playground/ssr-vue/vite.config.js index d57a11972d449e..1ec2ee61ec42f9 100644 --- a/playground/ssr-vue/vite.config.js +++ b/playground/ssr-vue/vite.config.js @@ -1,13 +1,17 @@ +import path from 'path' import { defineConfig } from 'vite' import vuePlugin from '@vitejs/plugin-vue' import vueJsx from '@vitejs/plugin-vue-jsx' + const virtualFile = '@virtual-file' const virtualId = '\0' + virtualFile const nestedVirtualFile = '@nested-virtual-file' const nestedVirtualId = '\0' + nestedVirtualFile +const base = '/test/' + export default defineConfig({ - base: '/test/', + base, plugins: [ vuePlugin(), vueJsx(), @@ -40,8 +44,78 @@ export default defineConfig({ return `export const msg = "[success] from conventional virtual file"` } } - } + }, + { + name: 'virtual-module', + resolveId(id) { + if (id === virtualFile) { + return virtualId + } else if (id === nestedVirtualFile) { + return nestedVirtualId + } + }, + load(id) { + if (id === virtualId) { + return `export { msg } from "@nested-virtual-file";` + } else if (id === nestedVirtualId) { + return `export const msg = "[success] from conventional virtual file"` + } + } + }, + // Example of a plugin that injects a helper from a virtual module that can + // be used in renderBuiltUrl + (function () { + const queryRE = /\?.*$/s + const hashRE = /#.*$/s + const cleanUrl = (url) => url.replace(hashRE, '').replace(queryRE, '') + let config + + const virtualId = '\0virtual:ssr-vue-built-url' + return { + name: 'built-url', + enforce: 'post', + configResolved(_config) { + config = _config + }, + resolveId(id) { + if (id === virtualId) { + return id + } + }, + load(id) { + if (id === virtualId) { + return { + code: `export const __ssr_vue_processAssetPath = (url) => '${base}' + url`, + moduleSideEffects: 'no-treeshake' + } + } + }, + transform(code, id) { + if ( + config.build.ssr && + cleanUrl(id).endsWith('.js') && + !code.includes('__ssr_vue_processAssetPath') + ) { + return { + code: + `import { __ssr_vue_processAssetPath } from '${virtualId}';` + + code, + sourcemap: null // no sourcemap support to speed up CI + } + } + } + } + })() ], + experimental: { + renderBuiltUrl(filename, importer, { type, ssr }) { + if (type === 'asset' && ssr && path.extname(importer) === '.js') { + return { + runtime: `__ssr_vue_processAssetPath(${JSON.stringify(filename)})` + } + } + } + }, build: { minify: false },