fix(optimizer): start optimizer after buildStart (#12832)

Author: bluwy

packages/vite/src/node/optimizer/index.ts

@@ -27,7 +27,6 @@ import {
 import { transformWithEsbuild } from '../plugins/esbuild'
 import { ESBUILD_MODULES_TARGET } from '../constants'
 import { resolvePackageData } from '../packages'
-import type { ViteDevServer } from '../server'
 import { esbuildCjsExternalPlugin, esbuildDepPlugin } from './esbuildDepPlugin'
 import { scanImports } from './scan'
 export {
@@ -66,7 +65,6 @@ export interface DepsOptimizer {
   close: () => Promise<void>
 
   options: DepOptimizationOptions
-  server?: ViteDevServer
 }
 
 export interface DepOptimizationConfig {

packages/vite/src/node/optimizer/optimizer.ts

@@ -120,7 +120,6 @@ async function createDepsOptimizer(
     ensureFirstRun,
     close,
     options: getDepOptimizationConfig(config, ssr),
-    server,
   }
 
   depsOptimizerMap.set(config, depsOptimizer)
@@ -471,13 +470,13 @@ async function createDepsOptimizer(
   }
 
   function fullReload() {
-    if (depsOptimizer.server) {
+    if (server) {
       // Cached transform results have stale imports (resolved to
       // old locations) so they need to be invalidated before the page is
       // reloaded.
-      depsOptimizer.server.moduleGraph.invalidateAll()
+      server.moduleGraph.invalidateAll()
 
-      depsOptimizer.server.ws.send({
+      server.ws.send({
         type: 'full-reload',
         path: '*',
       })

packages/vite/src/node/server/index.ts

@@ -347,11 +347,6 @@ export async function _createServer(
 ): Promise<ViteDevServer> {
   const config = await resolveConfig(inlineConfig, 'serve')
 
-  if (isDepsOptimizerEnabled(config, false)) {
-    // start optimizer in the background, we still need to await the setup
-    await initDepsOptimizer(config)
-  }
-
   const { root, server: serverConfig } = config
   const httpsOptions = await resolveHttpsConfig(config.server.https)
   const { middlewareMode } = serverConfig
@@ -656,13 +651,6 @@ export async function _createServer(
   // error handler
   middlewares.use(errorMiddleware(server, middlewareMode))
 
-  // when the optimizer is ready, hook server so that it can reload the page
-  // or invalidate the module graph when needed
-  const depsOptimizer = getDepsOptimizer(config)
-  if (depsOptimizer) {
-    depsOptimizer.server = server
-  }
-
   // httpServer.listen can be called multiple times
   // when port when using next port number
   // this code is to avoid calling buildStart multiple times
@@ -674,6 +662,10 @@ export async function _createServer(
 
     initingServer = (async function () {
       await container.buildStart({})
+      // start deps optimizer after all container plugins are ready
+      if (isDepsOptimizerEnabled(config, false)) {
+        await initDepsOptimizer(config, server)
+      }
       initingServer = undefined
       serverInited = true
     })()