From 67aa12ce4d1eec3a7dce0f1c8576f26f5a5b6c64 Mon Sep 17 00:00:00 2001 From: Tobbe Lundberg Date: Wed, 20 Nov 2024 09:34:46 +0100 Subject: [PATCH] chore(vite): Rename 'vite' to more descriptive 'viteSsrDevServer' (#11726) --- .../ogimage-gen/src/OgImageMiddleware.test.ts | 4 +-- packages/ogimage-gen/src/OgImageMiddleware.ts | 4 +-- packages/vite/src/devFeServer.ts | 32 +++++++++++-------- packages/vite/src/rsc/rscRequestHandler.ts | 4 +-- .../streaming/createReactStreamingHandler.ts | 22 +++++++------ .../vite/src/streaming/triggerRouteHooks.ts | 10 +++--- packages/web/src/server/middleware.ts | 2 +- 7 files changed, 44 insertions(+), 34 deletions(-) diff --git a/packages/ogimage-gen/src/OgImageMiddleware.test.ts b/packages/ogimage-gen/src/OgImageMiddleware.test.ts index 6aa197a6be58..f07baa92d5d0 100644 --- a/packages/ogimage-gen/src/OgImageMiddleware.test.ts +++ b/packages/ogimage-gen/src/OgImageMiddleware.test.ts @@ -183,7 +183,7 @@ describe('OgImageMiddleware', () => { test('importComponent should import the component using viteDevServer', async () => { const filePath = '/path/to/component.js' const invokeOptions = { - viteDevServer: { + viteSsrDevServer: { ssrLoadModule: vi.fn().mockResolvedValue({ data: 'some data', output: 'Component output', @@ -198,7 +198,7 @@ describe('OgImageMiddleware', () => { Component: 'Component output', }) - expect(invokeOptions.viteDevServer.ssrLoadModule).toHaveBeenCalledWith( + expect(invokeOptions.viteSsrDevServer.ssrLoadModule).toHaveBeenCalledWith( filePath, ) }) diff --git a/packages/ogimage-gen/src/OgImageMiddleware.ts b/packages/ogimage-gen/src/OgImageMiddleware.ts index 0b418ab579e6..901bfead9086 100644 --- a/packages/ogimage-gen/src/OgImageMiddleware.ts +++ b/packages/ogimage-gen/src/OgImageMiddleware.ts @@ -304,9 +304,9 @@ export default class OgImageMiddleware { invokeOptions: MiddlewareInvokeOptions, ) { try { - if (invokeOptions.viteDevServer) { + if (invokeOptions.viteSsrDevServer) { const { data, output } = - await invokeOptions.viteDevServer.ssrLoadModule(filePath) + await invokeOptions.viteSsrDevServer.ssrLoadModule(filePath) return { data, Component: output } } else { const { data, output } = await import(filePath) diff --git a/packages/vite/src/devFeServer.ts b/packages/vite/src/devFeServer.ts index 51e0b826a251..ceab8edb7884 100644 --- a/packages/vite/src/devFeServer.ts +++ b/packages/vite/src/devFeServer.ts @@ -91,7 +91,7 @@ async function createServer() { // Create Vite server in middleware mode and configure the app type as // 'custom', disabling Vite's own HTML serving logic so parent server // can take control - const vite = await createViteServer({ + const viteSsrDevServer = await createViteServer({ configFile: rwPaths.web.viteConfig, envFile: false, define: { @@ -180,7 +180,8 @@ async function createServer() { appType: 'custom', }) - globalThis.__rwjs__vite_ssr_runtime = await createViteRuntime(vite) + globalThis.__rwjs__vite_ssr_runtime = + await createViteRuntime(viteSsrDevServer) globalThis.__rwjs__client_references = new Set() // const clientEntryFileSet = new Set() @@ -355,7 +356,7 @@ async function createServer() { const handleWithMiddleware = (route?: RouteSpec) => { return createServerAdapter(async (req: Request) => { // Recreate middleware router on each request in dev - const middlewareRouter = await createMiddlewareRouter(vite) + const middlewareRouter = await createMiddlewareRouter(viteSsrDevServer) const middleware = middlewareRouter.find( req.method as HTTPMethod, req.url, @@ -367,7 +368,7 @@ async function createServer() { const [mwRes] = await invoke(req, middleware, { route, - viteDevServer: vite, + viteSsrDevServer, }) return mwRes.toResponse() @@ -375,7 +376,7 @@ async function createServer() { } // use vite's connect instance as middleware - app.use(vite.middlewares) + app.use(viteSsrDevServer.middlewares) if (rscEnabled) { createWebSocketServer() @@ -389,8 +390,9 @@ async function createServer() { app.use( '/rw-rsc', await createRscRequestHandler({ - getMiddlewareRouter: async () => createMiddlewareRouter(vite), - viteDevServer: vite, + getMiddlewareRouter: async () => + createMiddlewareRouter(viteSsrDevServer), + viteSsrDevServer, }), ) } @@ -403,12 +405,16 @@ async function createServer() { clientEntryPath: rwPaths.web.entryClient, getStylesheetLinks: (route) => { // In dev route is a RouteSpec, with additional properties - return getCssLinks({ rwPaths, route: route as RouteSpec, vite }) + return getCssLinks({ + rwPaths, + route: route as RouteSpec, + viteSsrDevServer, + }) }, // Recreate middleware router on each request in dev - getMiddlewareRouter: async () => createMiddlewareRouter(vite), + getMiddlewareRouter: async () => createMiddlewareRouter(viteSsrDevServer), }, - vite, + viteSsrDevServer, ) app.get('*', createServerAdapter(routeHandler)) @@ -442,15 +448,15 @@ process.stdin.on('data', async (data) => { function getCssLinks({ rwPaths, route, - vite, + viteSsrDevServer, }: { rwPaths: Paths route?: RouteSpec - vite: ViteDevServer + viteSsrDevServer: ViteDevServer }) { const appAndRouteModules = componentsModules( [rwPaths.web.app, route?.filePath].filter(Boolean) as string[], - vite, + viteSsrDevServer, ) const collectedCss = collectCssPaths(appAndRouteModules) diff --git a/packages/vite/src/rsc/rscRequestHandler.ts b/packages/vite/src/rsc/rscRequestHandler.ts index 1d36236195d2..f1a2925a48f4 100644 --- a/packages/vite/src/rsc/rscRequestHandler.ts +++ b/packages/vite/src/rsc/rscRequestHandler.ts @@ -24,7 +24,7 @@ const BASE_PATH = '/rw-rsc/' interface CreateRscRequestHandlerOptions { getMiddlewareRouter: () => Promise> - viteDevServer?: ViteDevServer + viteSsrDevServer?: ViteDevServer } export async function createRscRequestHandler( @@ -59,7 +59,7 @@ export async function createRscRequestHandler( matchedMw?.handler as Middleware | undefined, { params: matchedMw?.params, - viteDevServer: options.viteDevServer, + viteSsrDevServer: options.viteSsrDevServer, }, ) diff --git a/packages/vite/src/streaming/createReactStreamingHandler.ts b/packages/vite/src/streaming/createReactStreamingHandler.ts index a0f0dcfe4b36..5affb96d7a79 100644 --- a/packages/vite/src/streaming/createReactStreamingHandler.ts +++ b/packages/vite/src/streaming/createReactStreamingHandler.ts @@ -41,11 +41,11 @@ export const createReactStreamingHandler = async ( getStylesheetLinks, getMiddlewareRouter, }: CreateReactStreamingHandlerOptions, - viteDevServer?: ViteDevServer, + viteSsrDevServer?: ViteDevServer, ) => { const rwPaths = getPaths() const rwConfig = getConfig() - const isProd = !viteDevServer + const isProd = !viteSsrDevServer const middlewareRouter: Router.Instance = await getMiddlewareRouter() let entryServerImport: EntryServer let fallbackDocumentImport: Record @@ -115,7 +115,7 @@ export const createReactStreamingHandler = async ( route: currentRoute, cssPaths: cssLinks, params: matchedMw?.params, - viteDevServer, + viteSsrDevServer, }, ) @@ -144,8 +144,8 @@ export const createReactStreamingHandler = async ( // Do this inside the handler for **dev-only**. // This makes sure that changes to entry-server are picked up on refresh if (!isProd) { - entryServerImport = await ssrLoadEntryServer(viteDevServer) - fallbackDocumentImport = await viteDevServer.ssrLoadModule( + entryServerImport = await ssrLoadEntryServer(viteSsrDevServer) + fallbackDocumentImport = await viteSsrDevServer.ssrLoadModule( rwPaths.web.document, ) } @@ -173,13 +173,15 @@ export const createReactStreamingHandler = async ( req, parsedParams, }, - viteDevServer, + viteSsrDevServer, }) metaTags = routeHookOutput.meta // On dev, we don't need to add the slash (for windows support) any more - const jsBundles = [viteDevServer ? clientEntryPath : '/' + clientEntryPath] + const jsBundles = [ + viteSsrDevServer ? clientEntryPath : '/' + clientEntryPath, + ] if (currentRoute.bundle) { jsBundles.push('/' + currentRoute.bundle) } @@ -201,14 +203,14 @@ export const createReactStreamingHandler = async ( { waitForAllReady: isSeoCrawler, onError: (err) => { - if (!isProd && viteDevServer) { - viteDevServer.ssrFixStacktrace(err) + if (!isProd && viteSsrDevServer) { + viteSsrDevServer.ssrFixStacktrace(err) } console.error(err) }, }, - viteDevServer, + viteSsrDevServer, ) return reactResponse diff --git a/packages/vite/src/streaming/triggerRouteHooks.ts b/packages/vite/src/streaming/triggerRouteHooks.ts index 822a3ac666e0..158b679347cf 100644 --- a/packages/vite/src/streaming/triggerRouteHooks.ts +++ b/packages/vite/src/streaming/triggerRouteHooks.ts @@ -60,7 +60,7 @@ interface LoadAndRunRouteHooks { req: Request parsedParams?: Record } - viteDevServer?: ViteDevServer + viteSsrDevServer?: ViteDevServer previousOutput?: RouteHookOutput } @@ -71,12 +71,14 @@ const defaultRouteHookOutput = { export const loadAndRunRouteHooks = async ({ paths = [], reqMeta, - viteDevServer, + viteSsrDevServer, previousOutput = defaultRouteHookOutput, }: LoadAndRunRouteHooks): Promise => { // Step 1, load the route hooks const loadModule = async (path: string) => { - return viteDevServer ? viteDevServer.ssrLoadModule(path) : import(path) + return viteSsrDevServer + ? viteSsrDevServer.ssrLoadModule(path) + : import(path) } let currentRouteHooks: RouteHooks @@ -105,7 +107,7 @@ export const loadAndRunRouteHooks = async ({ paths, reqMeta, previousOutput: rhOutput, - viteDevServer, + viteSsrDevServer, }) } else { return rhOutput diff --git a/packages/web/src/server/middleware.ts b/packages/web/src/server/middleware.ts index 37f37f2a9d44..d0e0f5cc0441 100644 --- a/packages/web/src/server/middleware.ts +++ b/packages/web/src/server/middleware.ts @@ -14,7 +14,7 @@ export type MiddlewareInvokeOptions = { route?: RWRouteManifestItem cssPaths?: string[] params?: Record - viteDevServer?: ViteDevServer + viteSsrDevServer?: ViteDevServer } export type Middleware = (