Merge branch 'main' into docs/getting-started/routing

Author: Sébastien Chopin

package.json

@@ -50,7 +50,7 @@
     "@actions/core": "^1.9.1",
     "@nuxtjs/eslint-config-typescript": "^11.0.0",
     "@types/crawler": "^1.2.2",
-    "@types/node": "^16.11.58",
+    "@types/node": "^16.11.59",
     "@types/rimraf": "^3",
     "@unocss/reset": "^0.45.21",
     "case-police": "^0.5.10",

packages/kit/src/loader/config.ts

@@ -7,6 +7,7 @@ import { NuxtConfigSchema } from '@nuxt/schema'
 export interface LoadNuxtConfigOptions extends LoadConfigOptions<NuxtConfig> {}
 
 export async function loadNuxtConfig (opts: LoadNuxtConfigOptions): Promise<NuxtOptions> {
+  (globalThis as any).defineNuxtConfig = (c: any) => c
   const result = await loadConfig<NuxtConfig>({
     name: 'nuxt',
     configFile: 'nuxt.config',
@@ -16,6 +17,7 @@ export async function loadNuxtConfig (opts: LoadNuxtConfigOptions): Promise<Nuxt
     globalRc: true,
     ...opts
   })
+  delete (globalThis as any).defineNuxtConfig
   const { configFile, layers = [], cwd } = result
   const nuxtConfig = result.config!
 

packages/nuxi/package.json

@@ -34,7 +34,7 @@
     "destr": "^1.1.1",
     "execa": "^6.1.0",
     "flat": "^5.0.2",
-    "giget": "^0.1.5",
+    "giget": "^0.1.6",
     "jiti": "^1.15.0",
     "listhen": "^0.2.15",
     "mlly": "^0.5.14",

packages/nuxt/config.cjs

@@ -0,0 +1,7 @@
+function defineNuxtConfig (config) {
+  return config
+}
+
+module.exports = {
+  defineNuxtConfig
+}

packages/nuxt/config.d.ts

@@ -0,0 +1,4 @@
+import { NuxtConfig } from '@nuxt/schema'
+export { NuxtConfig } from '@nuxt/schema'
+
+export declare function defineNuxtConfig(config: NuxtConfig): NuxtConfig

packages/nuxt/config.mjs

@@ -0,0 +1,5 @@
+function defineNuxtConfig (config) {
+  return config
+}
+
+export { defineNuxtConfig }

packages/nuxt/package.json

@@ -12,6 +12,11 @@
   },
   "exports": {
     ".": "./dist/index.mjs",
+    "./config": {
+      "import": "./config.mjs",
+      "require": "./config.cjs",
+      "types": "./config.d.ts"
+    },
     "./app": "./dist/app/index.mjs",
     "./package.json": "./package.json"
   },
@@ -24,7 +29,8 @@
     "app.d.ts",
     "bin",
     "types.d.ts",
-    "dist"
+    "dist",
+    "config.*"
   ],
   "scripts": {
     "prepack": "unbuild"

packages/nuxt/src/app/plugins/payload.client.ts

@@ -2,7 +2,7 @@ import { defineNuxtPlugin, loadPayload, addRouteMiddleware, isPrerendered } from
 
 export default defineNuxtPlugin((nuxtApp) => {
   // Only enable behavior if initial page is prerendered
-  // TOOD: Support hybrid
+  // TOOD: Support hybrid and dev
   if (!isPrerendered()) {
     return
   }

packages/nuxt/src/core/nuxt.ts

@@ -174,7 +174,9 @@ async function initNuxt (nuxt: Nuxt) {
   })
 
   // Add prerender payload support
-  addPlugin(resolve(nuxt.options.appDir, 'plugins/payload.client'))
+  if (!nuxt.options.dev) {
+    addPlugin(resolve(nuxt.options.appDir, 'plugins/payload.client'))
+  }
 
   // Track components used to render for webpack
   if (nuxt.options.builder === '@nuxt/webpack-builder') {
@@ -234,9 +236,11 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
   return nuxt
 }
 
+/** @deprecated `defineNuxtConfig` is auto imported. Remove import or alternatively use `import { defineNuxtConfig } from  'nuxt/config'`. */
 export function defineNuxtConfig (config: NuxtConfig): NuxtConfig {
   return config
 }
 
-// For a convenience import together with `defineNuxtConfig`
-export type { NuxtConfig }
+/** @deprecated Use `import type { NuxtConfig } from  'nuxt/config'`.  */
+type _NuxtConfig = NuxtConfig
+export type { _NuxtConfig as NuxtConfig }

packages/nuxt/src/pages/runtime/page.ts

@@ -1,4 +1,4 @@
-import { computed, defineComponent, h, inject, provide, reactive, onMounted, nextTick, Suspense, Transition } from 'vue'
+import { computed, defineComponent, h, inject, provide, reactive, onMounted, nextTick, Suspense, Transition, KeepAliveProps, TransitionProps } from 'vue'
 import type { DefineComponent, VNode } from 'vue'
 import { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
 import type { RouteLocation } from 'vue-router'
@@ -18,6 +18,14 @@ export default defineComponent({
     name: {
       type: String
     },
+    transition: {
+      type: [Boolean, Object] as any as () => boolean | TransitionProps,
+      default: undefined
+    },
+    keepalive: {
+      type: [Boolean, Object] as any as () => boolean | KeepAliveProps,
+      default: undefined
+    },
     route: {
       type: Object as () => RouteLocationNormalized
     },
@@ -38,10 +46,10 @@ export default defineComponent({
           if (!routeProps.Component) { return }
 
           const key = generateRouteKey(props.pageKey, routeProps)
-          const transitionProps = routeProps.route.meta.pageTransition ?? defaultPageTransition
+          const transitionProps = props.transition ?? routeProps.route.meta.pageTransition ?? (defaultPageTransition as TransitionProps)
 
           return _wrapIf(Transition, transitionProps,
-            wrapInKeepAlive(routeProps.route.meta.keepalive ?? defaultKeepaliveConfig, isNested && nuxtApp.isHydrating
+            wrapInKeepAlive(props.keepalive ?? routeProps.route.meta.keepalive ?? (defaultKeepaliveConfig as KeepAliveProps), isNested && nuxtApp.isHydrating
               // Include route children in parent suspense
               ? h(Component, { key, routeProps, pageKey: key, hasTransition: !!transitionProps } as {})
               : h(Suspense, {