feat(nuxt): app.config with hmr and reactivity support

packages/kit/package.json

@@ -16,7 +16,7 @@
     "@nuxt/schema": "3.0.0-rc.8",
     "c12": "^0.2.9",
     "consola": "^2.15.3",
-    "defu": "^6.0.0",
+    "defu": "^6.1.0",
     "globby": "^13.1.2",
     "hash-sum": "^2.0.0",
     "ignore": "^5.2.0",

packages/nuxt/package.json

@@ -41,7 +41,7 @@
     "@vueuse/head": "^0.7.9",
     "chokidar": "^3.5.3",
     "cookie-es": "^0.5.0",
-    "defu": "^6.0.0",
+    "defu": "^6.1.0",
     "destr": "^1.1.1",
     "escape-string-regexp": "^5.0.0",
     "fs-extra": "^10.1.0",

packages/nuxt/src/core/templates.ts

@@ -124,7 +124,7 @@ export const schemaTemplate = {
       "declare module '@nuxt/schema' {",
       '  interface NuxtConfig {',
       ...moduleInfo.filter(Boolean).map(meta =>
-      `    [${genString(meta.configKey)}]?: typeof ${genDynamicImport(meta.importName, { wrapper: false })}.default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>`
+        `    [${genString(meta.configKey)}]?: typeof ${genDynamicImport(meta.importName, { wrapper: false })}.default extends NuxtModule<infer O> ? Partial<O> : Record<string, any>`
       ),
       '  }',
       generateTypes(resolveSchema(Object.fromEntries(Object.entries(nuxt.options.runtimeConfig).filter(([key]) => key !== 'public'))),
@@ -157,7 +157,7 @@ export const layoutTemplate: NuxtTemplate = {
     }))
     return [
       'import { defineAsyncComponent } from \'vue\'',
-          `export default ${layoutsObject}`
+      `export default ${layoutsObject}`
     ].join('\n')
   }
 }
@@ -188,12 +188,11 @@ export const appConfigDeclarationTemplate: NuxtTemplate = {
   filename: 'types/app.config.d.ts',
   getContents: ({ app, nuxt }) => {
     return `
-import defu from 'defu'
+import type { Defu } from 'defu'
 ${app.configs.map((id, index) => `import ${`cfg${index}`} from ${JSON.stringify(id.replace(/(?<=\w)\.\w+$/g, ''))}`).join('\n')}
 
 declare const inlineConfig = ${JSON.stringify(nuxt.options.appConfig, null, 2)}
-declare const resolvedConfig = defu(${app.configs.map((_id, index) => `cfg${index}`).concat(['inlineConfig']).join(', ')})
-type ResolvedAppConfig = typeof resolvedConfig
+type ResolvedAppConfig = Defu<typeof inlineConfig, [${app.configs.map((_id, index) => `typeof cfg${index}`).join(', ')}]>
 
 declare module '@nuxt/schema' {
   interface AppConfig extends ResolvedAppConfig { }

packages/schema/package.json

@@ -22,7 +22,7 @@
   "dependencies": {
     "c12": "^0.2.9",
     "create-require": "^1.1.1",
-    "defu": "^6.0.0",
+    "defu": "^6.1.0",
     "jiti": "^1.14.0",
     "pathe": "^0.3.4",
     "postcss-import-resolver": "^2.0.0",

packages/test-utils/package.json

@@ -15,7 +15,7 @@
   "dependencies": {
     "@nuxt/kit": "3.0.0-rc.8",
     "@nuxt/schema": "3.0.0-rc.8",
-    "defu": "^6.0.0",
+    "defu": "^6.1.0",
     "execa": "^6.1.0",
     "get-port-please": "^2.6.1",
     "jiti": "^1.14.0",

packages/vite/package.json

@@ -26,7 +26,7 @@
     "autoprefixer": "^10.4.8",
     "chokidar": "^3.5.3",
     "cssnano": "^5.1.12",
-    "defu": "^6.0.0",
+    "defu": "^6.1.0",
     "esbuild": "^0.15.1",
     "escape-string-regexp": "^5.0.0",
     "estree-walker": "^3.0.1",

test/fixtures/basic/app.config.ts

@@ -1,10 +1,12 @@
 // TODO
 // import { defineAppConfig } from '#imports'
-import type { AppConfig } from '@nuxt/schema'
 
-export default <AppConfig>({
+// For now we can't use AppConfig to type this
+// as it will circularly reference itself
+
+export default {
   userConfig: 123,
   nested: {
     val: 2
   }
-})
+}

test/fixtures/basic/types.ts

@@ -1,6 +1,7 @@
 import { expectTypeOf } from 'expect-type'
 import { describe, it } from 'vitest'
 import type { Ref } from 'vue'
+import type { AppConfig } from '@nuxt/schema'
 
 import { NavigationFailure, RouteLocationNormalizedLoaded, RouteLocationRaw, useRouter as vueUseRouter } from 'vue-router'
 import { defineNuxtConfig } from '~~/../../../packages/nuxt/src'
@@ -164,3 +165,17 @@ describe('composables', () => {
       .toMatchTypeOf(useLazyAsyncData(() => Promise.resolve({ foo: Math.random() }), { transform: data => data.foo }))
   })
 })
+
+describe('app config', () => {
+  it('merges app config as expected', () => {
+    interface ExpectedMergedAppConfig {
+      fromLayer: boolean,
+      fromNuxtConfig: boolean,
+      nested: {
+        val: number
+      },
+      userConfig: number
+    }
+    expectTypeOf<AppConfig>().toMatchTypeOf<ExpectedMergedAppConfig>()
+  })
+})

yarn.lock

@@ -1646,7 +1646,7 @@ __metadata:
     "@types/semver": ^7
     c12: ^0.2.9
     consola: ^2.15.3
-    defu: ^6.0.0
+    defu: ^6.1.0
     globby: ^13.1.2
     hash-sum: ^2.0.0
     ignore: ^5.2.0
@@ -1679,7 +1679,7 @@ __metadata:
     "@types/semver": ^7
     c12: ^0.2.9
     create-require: ^1.1.1
-    defu: ^6.0.0
+    defu: ^6.1.0
     jiti: ^1.14.0
     pathe: ^0.3.4
     postcss-import-resolver: ^2.0.0
@@ -1728,7 +1728,7 @@ __metadata:
   dependencies:
     "@nuxt/kit": 3.0.0-rc.8
     "@nuxt/schema": 3.0.0-rc.8
-    defu: ^6.0.0
+    defu: ^6.1.0
     execa: ^6.1.0
     get-port-please: ^2.6.1
     jiti: ^1.14.0
@@ -1784,7 +1784,7 @@ __metadata:
     autoprefixer: ^10.4.8
     chokidar: ^3.5.3
     cssnano: ^5.1.12
-    defu: ^6.0.0
+    defu: ^6.1.0
     esbuild: ^0.15.1
     escape-string-regexp: ^5.0.0
     estree-walker: ^3.0.1
@@ -5093,6 +5093,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"defu@npm:^6.1.0":
+  version: 6.1.0
+  resolution: "defu@npm:6.1.0"
+  checksum: 403a9ba8ab08dca87576eb062fa488c5cc58a5c8601955f2325dcc077c23da8a68169591505654a8c70ca3567006516ef92a4c44129643f928c58c4e7281195a
+  languageName: node
+  linkType: hard
+
 "delegates@npm:^1.0.0":
   version: 1.0.0
   resolution: "delegates@npm:1.0.0"
@@ -9919,7 +9926,7 @@ __metadata:
     "@vueuse/head": ^0.7.9
     chokidar: ^3.5.3
     cookie-es: ^0.5.0
-    defu: ^6.0.0
+    defu: ^6.1.0
     destr: ^1.1.1
     escape-string-regexp: ^5.0.0
     fs-extra: ^10.1.0