fix: handle tsconfig watching without watchChange as tsconfig files are not modules that pass through it

packages/vite/src/node/plugins/esbuild.ts

@@ -18,8 +18,9 @@ import {
   createFilter,
   ensureWatchedFile,
   generateCodeFrame,
+  normalizePath,
 } from '../utils'
-import type { ViteDevServer } from '../server'
+
 import type { ResolvedConfig } from '../config'
 import type { Plugin } from '../plugin'
 import { cleanUrl } from '../../shared/utils'
@@ -254,20 +255,22 @@ export function esbuildPlugin(config: ResolvedConfig): Plugin {
     },
   }
 
-  let server: ViteDevServer
-
   return {
     name: 'vite:esbuild',
-    configureServer(_server) {
-      server = _server
-    },
-    watchChange(id) {
+    configureServer(server) {
+      // we need to watch all files to find changes to previously unknown tsconfig.json files
+      server.watcher.on('all', (event, file) => {
         if (
-        path.basename(id) === 'tsconfig.json' ||
-        (id.endsWith('.json') && tsconfckCache?.hasParseResult(id))
+          (event === 'add' || event === 'change' || event === 'unlink') &&
+          file.slice(-5) === '.json'
+        ) {
+          const filename = normalizePath(file)
+          if (
+            filename.slice(-14) === '/tsconfig.json' ||
+            tsconfckCache?.hasParseResult(filename)
           ) {
             server.config.logger.info(
-          `changed tsconfig file detected: ${id} - Clearing cache and forcing full-reload to ensure TypeScript is compiled with updated config values.`,
+              `changed tsconfig file detected: ${filename} - Clearing cache and forcing full-reload to ensure TypeScript is compiled with updated config values.`,
               { clear: server.config.clearScreen, timestamp: true },
             )
 
@@ -289,6 +292,8 @@ export function esbuildPlugin(config: ResolvedConfig): Plugin {
               })
             }
           }
+        }
+      })
     },
     async transform(code, id) {
       if (filter(id) || filter(cleanUrl(id))) {