wip

packages/nuxt/src/app/components/nuxt-layout.ts

@@ -40,7 +40,7 @@ export default defineComponent({
   inheritAttrs: false,
   props: {
     name: {
-      type: [String, Boolean, Object] as unknown as () => unknown extends PageMeta['layout'] ? MaybeRef<string | false> : PageMeta['layout'],
+      type: [String, Boolean, Object] as unknown as () => unknown extends ['layout'] ? MaybeRef<string | false> : PageMeta['layout'],
       default: null
     },
     fallback: {

packages/nuxt/src/pages/module.ts

@@ -8,7 +8,6 @@ import type { Nuxt, NuxtApp, NuxtPage } from 'nuxt/schema'
 import { createRoutesContext } from 'unplugin-vue-router'
 import { resolveOptions } from 'unplugin-vue-router/options'
 import type { EditableTreeNode, Options as TypedRouterOptions } from 'unplugin-vue-router'
-
 import type { NitroRouteConfig } from 'nitropack'
 import { defu } from 'defu'
 import { distDir } from '../dirs'
@@ -322,7 +321,8 @@ export default defineNuxtModule({
     // Extract macros from pages
     const pageMetaOptions: PageMetaPluginOptions = {
       dev: nuxt.options.dev,
-      sourcemap: !!nuxt.options.sourcemap.server || !!nuxt.options.sourcemap.client
+      sourcemap: !!nuxt.options.sourcemap.server || !!nuxt.options.sourcemap.client,
+      updateTemplates
     }
     nuxt.hook('modules:done', () => {
       addVitePlugin(() => PageMetaPlugin.vite(pageMetaOptions))
@@ -364,7 +364,18 @@ export default defineNuxtModule({
       filename: 'routes.mjs',
       getContents ({ app }) {
         const { routes, imports } = normalizeRoutes(app.pages)
-        return [...imports, `export default ${routes}`].join('\n')
+        return `
+        ${
+          [...imports, `const routes = ${routes}`, `export default routes`].join('\n')
+        } 
+
+        if (import.meta.hot) {
+          import.meta.hot.accept((mod) => {
+            console.log('up', mod.default)
+            Object.assign(routes, mod.default)
+          })
+        }
+        `
       }
     })
 

packages/nuxt/src/pages/plugins/page-meta.ts

@@ -8,11 +8,12 @@ import type { Node } from 'estree-walker'
 import { walk } from 'estree-walker'
 import MagicString from 'magic-string'
 import { isAbsolute } from 'pathe'
-import { logger } from '@nuxt/kit'
-
+import { logger, updateTemplates as _updateTemplate } from '@nuxt/kit'
+import { } from "vite"
 export interface PageMetaPluginOptions {
   dev?: boolean
   sourcemap?: boolean
+  updateTemplates: typeof _updateTemplate
 }
 
 const HAS_MACRO_RE = /\bdefinePageMeta\s*\(\s*/
@@ -26,7 +27,7 @@ const CODE_HMR = `
 // Vite
 if (import.meta.hot) {
   import.meta.hot.accept(mod => {
-    Object.assign(__nuxt_page_meta, mod)
+    import.meta.hot.invalidate()
   })
 }
 // webpack
@@ -162,11 +163,22 @@ export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) =>
     vite: {
       handleHotUpdate: {
         order: 'pre',
-        handler: ({ modules }) => {
+        handler: async (ctx) => {
+          const { modules } = ctx
           // Remove macro file from modules list to prevent HMR overrides
           const index = modules.findIndex(i => i.id?.includes('?macro=true'))
           if (index !== -1) {
-            modules.splice(index, 1)
+            const [macroFile] = modules.splice(index, 1)
+            if (macroFile) {
+              await console.log(await ctx.read())
+              debugger
+              ctx.server.moduleGraph.invalidateModule(macroFile) 
+              ctx.server.reloadModule(macroFile) 
+              
+              // update the macro file
+
+            }
+
           }
         }
       }

packages/nuxt/src/pages/runtime/plugins/router.ts

@@ -91,6 +91,40 @@ const plugin: Plugin<{ router: Router }> = defineNuxtPlugin({
       previousRoute.value = from
     })
 
+    
+    if(import.meta.hot) {  
+      console.log(import.meta.hot)
+      import.meta.hot.accept(   () => {
+        console.log('hot reload self accept')
+         
+      })
+      import.meta.hot.accept( '/pages/index.vue?macro=true', () => {
+        console.log('hot reload')
+         
+      })
+      import.meta.hot.accept( '/pages/index.vue', () => {
+        console.log('hot reload')
+         
+      })
+      import.meta.hot.accept( '/pages/index.vue?macro=true', () => {
+        console.log('hot reload')
+         
+      })
+      import.meta.hot.accept( '#build/routes', () => {
+        console.log('hot reload')
+         
+      })
+      import.meta.hot.accept( '/@id/virtual:nuxt:G:/repo/nuxt/playground/.nuxt/routes.mjs', () => {
+        console.log('hot reload')
+      })
+      import.meta.hot.accept( '/@id/virtual:nuxt:G:/repo/nuxt/playground/.nuxt/routes.mjs', () => {
+        console.log('hot reload')
+      })
+      import.meta.hot.accept("/_nuxt/@id/virtual:nuxt:G:/repo/nuxt/playground/.nuxt/routes.mjs", () => {
+        console.log('hot reload mod')
+      })
+    }
+
     Object.defineProperty(nuxtApp.vueApp.config.globalProperties, 'previousRoute', {
       get: () => previousRoute.value
     })

playground/app.vue

@@ -1,13 +0,0 @@
-<script setup lang="ts">
-</script>
-
-<template>
-  <!-- Edit this file to play around with Nuxt but never commit changes! -->
-  <div>
-    Nuxt 3 Playground
-  </div>
-</template>
-
-<style scoped>
-
-</style>

playground/layouts/blue.vue

@@ -0,0 +1,6 @@
+<template>
+    <div class="blue" style="border: solid blue 1px;">
+      <slot />
+    </div>
+  </template>
+  

playground/layouts/default.vue

@@ -0,0 +1,6 @@
+<template>
+    <div class="red">
+      <slot />
+    </div>
+  </template>
+  

playground/pages/index.vue

@@ -0,0 +1,10 @@
+<template>
+    <div>Index Page</div>
+  </template>
+  
+  <script setup lang="ts">
+  definePageMeta({
+    layout: 'blue',
+  });
+  </script>
+  

test/fixtures/basic/nuxt.config.ts

@@ -188,8 +188,11 @@ export default defineNuxtConfig({
     compilerOptions: {
       isCustomElement: (tag) => {
         return tag === 'custom-component'
-      }
-    }
+      },
+      prefixIdentifiers: false,
+      
+    },
+    
   },
   experimental: {
     typedPages: true,