@nuxt/docs-nightly 4.3.0-29481175.992d2a5d → 4.3.0-29481280.f3d5bc5f

package/1.getting-started/03.configuration.md

@@ -135,10 +135,6 @@ As stated above, `runtimeConfig` and `app.config` are both used to expose variab
 
 | Feature                   | `runtimeConfig` | `app.config` |
 |---------------------------|-----------------|--------------|
-| Client Side               | Hydrated        | Bundled      |
-| Environment Variables     | ✅ Yes           | ❌ No         |
-| Reactive                  | ✅ Yes           | ✅ Yes        |
-| Types support             | ✅ Partial       | ✅ Yes        |
 | Client-side               | Hydrated        | Bundled      |
 | Environment variables     | ✅ Yes           | ❌ No         |
 | Reactive                  | ✅ Yes           | ✅ Yes        |

package/2.directory-structure/1.modules.md

@@ -18,7 +18,7 @@ You don't need to add those local modules to your [`nuxt.config.ts`](/docs/4.x/d
 ```ts twoslash [modules/hello/index.ts]
 // `nuxt/kit` is a helper subpath import you can use when defining local modules
 // that means you do not need to add `@nuxt/kit` to your project's dependencies
-import { addServerHandler, createResolver, defineNuxtModule } from 'nuxt/kit'
+import { addServerHandler, createResolver, defineNuxtModule, addComponentsDir } from 'nuxt/kit'
 
 export default defineNuxtModule({
   meta: {
@@ -32,6 +32,12 @@ export default defineNuxtModule({
       route: '/api/hello',
       handler: resolver.resolve('./runtime/api-route'),
     })
+
+    // Add components
+    addComponentsDir({
+      path: resolver.resolve('./runtime/app/components'),
+      pathPrefix: true // Prefix your exports to avoid conflicts with user code or other modules
+    })
   },
 })
 ```
@@ -46,6 +52,10 @@ export default defineEventHandler(() => {
 
 When starting Nuxt, the `hello` module will be registered and the `/api/hello` route will be available.
 
+::note
+Note that all components, pages, composables and other files that would be normally placed in your `app/` directory need to be in `modules/your-module/runtime/app/`. This ensures they can be type-checked properly.
+::
+
 Modules are executed in the following sequence:
 - First, the modules defined in [`nuxt.config.ts`](/docs/4.x/api/nuxt-config#modules-1) are loaded.
 - Then, modules found in the `modules/` directory are executed, and they load in alphabetical order.

package/2.directory-structure/2.nuxtrc.md

@@ -23,6 +23,9 @@ devtools.enabled=true
 # Add Nuxt modules
 modules[]=@nuxt/image
 modules[]=nuxt-security
+
+# Module setups (automatically added by Nuxt)
+setups.@nuxt/test-utils="3.23.0"
 ```
 
 If present, the properties in the `nuxt.config` file will overwrite the properties in `.nuxtrc` file.

package/3.guide/4.modules/3.recipes-basics.md

@@ -100,7 +100,7 @@ export default defineNuxtModule({
     addComponent({
       name: 'MySuperComponent', // name of the component to be used in vue templates
       export: 'MySuperComponent', // (optional) if the component is a named (rather than default) export
-      filePath: resolver.resolve('runtime/components/MySuperComponent.vue'),
+      filePath: resolver.resolve('runtime/app/components/MySuperComponent.vue'),
     })
 
     // From a library
@@ -123,7 +123,7 @@ export default defineNuxtModule({
     const resolver = createResolver(import.meta.url)
 
     addComponentsDir({
-      path: resolver.resolve('runtime/components'),
+      path: resolver.resolve('runtime/app/components'),
     })
   },
 })
@@ -135,6 +135,10 @@ It is highly recommended to prefix your exports to avoid conflicts with user cod
 :read-more{to="/docs/4.x/guide/modules/best-practices#prefix-your-exports"}
 ::
 
+::note
+Note that all components, pages, composables and other files that would be normally placed in your `app/` folder need to be in `runtime/app/`. This will mean they can be type checked properly.
+::
+
 ## Add Composables
 
 If your module should provide composables, you can use the `addImports` utility to add them as auto-imports for Nuxt to resolve.
@@ -149,7 +153,7 @@ export default defineNuxtModule({
     addImports({
       name: 'useComposable', // name of the composable to be used
       as: 'useMyComposable', // optional alias that will be available for the consuming apps
-      from: resolver.resolve('runtime/composables/useComposable'), // path of composable
+      from: resolver.resolve('runtime/app/composables/useComposable'), // path of composable
     })
   },
 })
@@ -192,6 +196,10 @@ It is highly recommended to prefix your exports to avoid conflicts with user cod
 :read-more{to="/docs/4.x/guide/modules/best-practices#prefix-your-exports"}
 ::
 
+::note
+Note that all components, pages, composables and other files that would be normally placed in your `app/` folder need to be in `runtime/app/`. This will mean they can be type checked properly.
+::
+
 ## Add Server Routes
 
 ```ts
@@ -222,6 +230,12 @@ export default defineNuxtModule({
       route: '/api/_my-module/hello/:name',
       handler: resolver.resolve('./runtime/server/api/hello/[name].get'),
     })
+
+    // Or using a catch all route
+    addServerHandler({
+      route: '/api/_my-module/files/**:path',
+      handler: resolver.resolve('./runtime/server/api/files/[...path].get'),
+    })
   },
 })
 ```

package/4.api/1.components/3.nuxt-layout.md

@@ -22,8 +22,8 @@ You can use `<NuxtLayout />` component to activate the `default` layout on `app.
 
 ## Props
 
-- `name`: Specify a layout name to be rendered, can be a string, reactive reference or a computed property. It **must** match the name of the corresponding layout file in the [`app/layouts/`](/docs/4.x/directory-structure/app/layouts) directory.
-  - **type**: `string`
+- `name`: Specify a layout name to be rendered, can be a string, reactive reference or a computed property. It **must** match the name of the corresponding layout file in the [`app/layouts/`](/docs/4.x/directory-structure/app/layouts) directory, or `false` to disable the layout.
+  - **type**: `string | false`
   - **default**: `default`
 
 ```vue [app/pages/index.vue]

package/4.api/2.composables/use-nuxt-app.md

@@ -136,6 +136,8 @@ Nuxt exposes the following properties through `ssrContext`:
 
   It is also possible to use more advanced types, such as `ref`, `reactive`, `shallowRef`, `shallowReactive` and `NuxtError`.
 
+#### Custom Reducer/Reviver
+
   Since [Nuxt v3.4](https://nuxt.com/blog/v3-4#payload-enhancements), it is possible to define your own reducer/reviver for types that are not supported by Nuxt.
 
   :video-accordion{title="Watch a video from Alexander Lichter about serializing payloads, especially with regards to classes" videoId="8w6ffRBs8a4"}

package/4.api/2.composables/use-state.md

@@ -46,3 +46,13 @@ export function useState<T> (key: string, init?: () => T | Ref<T>): Ref<T>
 - `key`: A unique key ensuring that data fetching is properly de-duplicated across requests. If you do not provide a key, then a key that is unique to the file and line number of the instance of [`useState`](/docs/4.x/api/composables/use-state) will be generated for you.
 - `init`: A function that provides initial value for the state when not initiated. This function can also return a `Ref`.
 - `T`: (typescript only) Specify the type of state
+
+## Troubleshooting
+
+### `Cannot stringify arbitrary non-POJOs`
+
+This error occurs when you try to store a non-serializable payload with `useState`, such as class instances.
+
+If you want to store class instances with `useState` that are not supported by Nuxt, you can use [`definePayloadPlugin`](/docs/4.x/api/composables/use-nuxt-app#custom-reducerreviver) to add a custom serializer and deserializer for your classes.
+
+:read-more{to="/docs/4.x/api/composables/use-nuxt-app#payload"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuxt/docs-nightly",
-  "version": "4.3.0-29481175.992d2a5d",
+  "version": "4.3.0-29481280.f3d5bc5f",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nuxt/nuxt.git",