From 4924e26329fa3f8ad4c0652970f2e40a59b83beb Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Sun, 17 Nov 2024 16:22:59 -0500
Subject: [PATCH] fix(nuxt): recompile templates on `change` events (#29954)

---
 packages/nuxt/src/core/builder.ts   | 28 ++++++++++++++++------------
 packages/nuxt/src/imports/module.ts |  7 ++-----
 2 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/packages/nuxt/src/core/builder.ts b/packages/nuxt/src/core/builder.ts
index 013c80fbe7..9b99319828 100644
--- a/packages/nuxt/src/core/builder.ts
+++ b/packages/nuxt/src/core/builder.ts
@@ -10,7 +10,6 @@ import { generateApp as _generateApp, createApp } from './app'
 import { checkForExternalConfigurationFiles } from './external-config-files'
 import { cleanupCaches, getVueHash } from './cache'
 
-const IS_RESTART_PATH_RE = /^(?:app\.|error\.|plugins\/|middleware\/|layouts\/)/i
 export async function build (nuxt: Nuxt) {
   const app = createApp(nuxt)
   nuxt.apps.default = app
@@ -21,19 +20,24 @@ export async function build (nuxt: Nuxt) {
   if (nuxt.options.dev) {
     watch(nuxt)
     nuxt.hook('builder:watch', async (event, relativePath) => {
-      if (event === 'change') { return }
-      const path = resolve(nuxt.options.srcDir, relativePath)
-      const relativePaths = nuxt.options._layers.map(l => relative(l.config.srcDir || l.cwd, path))
-      const restartPath = relativePaths.find(relativePath => IS_RESTART_PATH_RE.test(relativePath))
-      if (restartPath) {
-        if (restartPath.startsWith('app')) {
-          app.mainComponent = undefined
+      // Unset mainComponent and errorComponent if app or error component is changed
+      if (event === 'add' || event === 'unlink') {
+        const path = resolve(nuxt.options.srcDir, relativePath)
+        for (const layer of nuxt.options._layers) {
+          const relativePath = relative(layer.config.srcDir || layer.cwd, path)
+          if (relativePath.match(/^app\./i)) {
+            app.mainComponent = undefined
+            break
+          }
+          if (relativePath.match(/^error\./i)) {
+            app.errorComponent = undefined
+            break
+          }
         }
-        if (restartPath.startsWith('error')) {
-          app.errorComponent = undefined
-        }
-        await generateApp()
       }
+
+      // Recompile app templates
+      await generateApp()
     })
     nuxt.hook('builder:generateApp', (options) => {
       // Bypass debounce if we are selectively invalidating templates
diff --git a/packages/nuxt/src/imports/module.ts b/packages/nuxt/src/imports/module.ts
index 33aad9a885..1b9e698203 100644
--- a/packages/nuxt/src/imports/module.ts
+++ b/packages/nuxt/src/imports/module.ts
@@ -107,12 +107,9 @@ export default defineNuxtModule<Partial<ImportsOptions>>({
 
     const priorities = nuxt.options._layers.map((layer, i) => [layer.config.srcDir, -i] as const).sort(([a], [b]) => b.length - a.length)
 
+    const IMPORTS_TEMPLATE_RE = /\/imports\.(?:d\.ts|mjs)$/
     function isImportsTemplate (template: ResolvedNuxtTemplate) {
-      return [
-        '/types/imports.d.ts',
-        '/imports.d.ts',
-        '/imports.mjs',
-      ].some(i => template.filename.endsWith(i))
+      return IMPORTS_TEMPLATE_RE.test(template.filename)
     }
 
     const regenerateImports = async () => {