@nuxt/docs-nightly 4.2.2-29404491.1c73525a → 4.2.2-29413365.2a912219

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -133,37 +133,37 @@ As stated above, `runtimeConfig` and `app.config` are both used to expose variab
133
133
  - `runtimeConfig`: Private or public tokens that need to be specified after build using environment variables.
134
134
  - `app.config`: Public tokens that are determined at build time, website configuration such as theme variant, title and any project config that are not sensitive.
135
135
 
136
- Feature | `runtimeConfig` | `app.config`
137
- -------------------------------|------------------|-------------------
138
- Client Side | Hydrated | Bundled
139
- Environment Variables | ✅ Yes | ❌ No
140
- Reactive | ✅ Yes | ✅ Yes
141
- Types support | ✅ Partial | ✅ Yes
142
- Configuration per Request | ❌ No | ✅ Yes
143
- Hot Module Replacement | ❌ No | ✅ Yes
144
- Non primitive JS types | ❌ No | ✅ Yes
136
+ | Feature | `runtimeConfig` | `app.config` |
137
+ |---------------------------|-----------------|--------------|
138
+ | Client Side | Hydrated | Bundled |
139
+ | Environment Variables | ✅ Yes | ❌ No |
140
+ | Reactive | ✅ Yes | ✅ Yes |
141
+ | Types support | ✅ Partial | ✅ Yes |
142
+ | Configuration per Request | ❌ No | ✅ Yes |
143
+ | Hot Module Replacement | ❌ No | ✅ Yes |
144
+ | Non primitive JS types | ❌ No | ✅ Yes |
145
145
 
146
146
  ## External Configuration Files
147
147
 
148
148
  Nuxt uses [`nuxt.config.ts`](/docs/4.x/directory-structure/nuxt-config) file as the single source of truth for configurations and skips reading external configuration files. During the course of building your project, you may have a need to configure those. The following table highlights common configurations and, where applicable, how they can be configured with Nuxt.
149
149
 
150
- Name | Config File | How To Configure
151
- ---------------------------------------------|---------------------------|-------------------------
152
- [Nitro](https://nitro.build) | ~~`nitro.config.ts`~~ | Use [`nitro`](/docs/4.x/api/nuxt-config#nitro) key in `nuxt.config`
153
- [PostCSS](https://postcss.org) | ~~`postcss.config.js`~~ | Use [`postcss`](/docs/4.x/api/nuxt-config#postcss) key in `nuxt.config`
154
- [Vite](https://vite.dev) | ~~`vite.config.ts`~~ | Use [`vite`](/docs/4.x/api/nuxt-config#vite) key in `nuxt.config`
155
- [webpack](https://webpack.js.org) | ~~`webpack.config.ts`~~ | Use [`webpack`](/docs/4.x/api/nuxt-config#webpack-1) key in `nuxt.config`
150
+ | Name | Config File | How To Configure |
151
+ |-----------------------------------|-------------------------|---------------------------------------------------------------------------|
152
+ | [Nitro](https://nitro.build) | ~~`nitro.config.ts`~~ | Use [`nitro`](/docs/4.x/api/nuxt-config#nitro) key in `nuxt.config` |
153
+ | [PostCSS](https://postcss.org) | ~~`postcss.config.js`~~ | Use [`postcss`](/docs/4.x/api/nuxt-config#postcss) key in `nuxt.config` |
154
+ | [Vite](https://vite.dev) | ~~`vite.config.ts`~~ | Use [`vite`](/docs/4.x/api/nuxt-config#vite) key in `nuxt.config` |
155
+ | [webpack](https://webpack.js.org) | ~~`webpack.config.ts`~~ | Use [`webpack`](/docs/4.x/api/nuxt-config#webpack-1) key in `nuxt.config` |
156
156
 
157
157
  Here is a list of other common config files:
158
158
 
159
- Name | Config File | How To Configure
160
- ---------------------------------------------|-------------------------|--------------------------
161
- [TypeScript](https://www.typescriptlang.org) | `tsconfig.json` | [More Info](/docs/4.x/directory-structure/tsconfig)
162
- [ESLint](https://eslint.org) | `eslint.config.js` | [More Info](https://eslint.org/docs/latest/use/configure/configuration-files)
163
- [Prettier](https://prettier.io) | `prettier.config.js` | [More Info](https://prettier.io/docs/configuration.html)
164
- [Stylelint](https://stylelint.io) | `stylelint.config.js` | [More Info](https://stylelint.io/user-guide/configure/)
165
- [TailwindCSS](https://tailwindcss.com) | `tailwind.config.js` | [More Info](https://tailwindcss.nuxtjs.org/tailwindcss/configuration/)
166
- [Vitest](https://vitest.dev) | `vitest.config.ts` | [More Info](https://vitest.dev/config/)
159
+ | Name | Config File | How To Configure |
160
+ |----------------------------------------------|-----------------------|-------------------------------------------------------------------------------|
161
+ | [TypeScript](https://www.typescriptlang.org) | `tsconfig.json` | [More Info](/docs/4.x/directory-structure/tsconfig) |
162
+ | [ESLint](https://eslint.org) | `eslint.config.js` | [More Info](https://eslint.org/docs/latest/use/configure/configuration-files) |
163
+ | [Prettier](https://prettier.io) | `prettier.config.js` | [More Info](https://prettier.io/docs/configuration.html) |
164
+ | [Stylelint](https://stylelint.io) | `stylelint.config.js` | [More Info](https://stylelint.io/user-guide/configure/) |
165
+ | [TailwindCSS](https://tailwindcss.com) | `tailwind.config.js` | [More Info](https://tailwindcss.nuxtjs.org/tailwindcss/configuration/) |
166
+ | [Vitest](https://vitest.dev) | `vitest.config.ts` | [More Info](https://vitest.dev/config/) |
167
167
 
168
168
  ## Vue Configuration
169
169
 
@@ -1312,23 +1312,23 @@ Read more about Nitro's prerender configuration options.
1312
1312
 
1313
1313
  In the table below, there is a quick comparison between 3 versions of Nuxt:
1314
1314
 
1315
- Feature / Version | Nuxt 2 | Nuxt Bridge | Nuxt 3+
1316
- -------------------------|-----------------|------------------|---------
1317
- Vue | 2 | 2 | 3
1318
- Stability | 😊 Stable | 😊 Stable | 😊 Stable
1319
- Performance | 🏎 Fast | ✈️ Faster | 🚀 Fastest
1320
- Nitro Engine | ❌ | ✅ | ✅
1321
- ESM support | 🌙 Partial | 👍 Better | ✅
1322
- TypeScript | ☑️ Opt-in | 🚧 Partial | ✅
1323
- Composition API | ❌ | 🚧 Partial | ✅
1324
- Options API | ✅ | ✅ | ✅
1325
- Components Auto Import | ✅ | ✅ | ✅
1326
- `<script setup>` syntax | ❌ | 🚧 Partial | ✅
1327
- Auto Imports | ❌ | ✅ | ✅
1328
- webpack | 4 | 4 | 5
1329
- Vite | ⚠️ Partial | 🚧 Partial | ✅
1330
- Nuxt CLI | ❌ Old | ✅ nuxt | ✅ nuxt
1331
- Static sites | ✅ | ✅ | ✅
1315
+ | Feature / Version | Nuxt 2 | Nuxt Bridge | Nuxt 3+ |
1316
+ |-------------------------|------------|-------------|------------|
1317
+ | Vue | 2 | 2 | 3 |
1318
+ | Stability | 😊 Stable | 😊 Stable | 😊 Stable |
1319
+ | Performance | 🏎 Fast | ✈️ Faster | 🚀 Fastest |
1320
+ | Nitro Engine | ❌ | ✅ | ✅ |
1321
+ | ESM support | 🌙 Partial | 👍 Better | ✅ |
1322
+ | TypeScript | ☑️ Opt-in | 🚧 Partial | ✅ |
1323
+ | Composition API | ❌ | 🚧 Partial | ✅ |
1324
+ | Options API | ✅ | ✅ | ✅ |
1325
+ | Components Auto Import | ✅ | ✅ | ✅ |
1326
+ | `<script setup>` syntax | ❌ | 🚧 Partial | ✅ |
1327
+ | Auto Imports | ❌ | ✅ | ✅ |
1328
+ | webpack | 4 | 4 | 5 |
1329
+ | Vite | ⚠️ Partial | 🚧 Partial | ✅ |
1330
+ | Nuxt CLI | ❌ Old | ✅ nuxt | ✅ nuxt |
1331
+ | Static sites | ✅ | ✅ | ✅ |
1332
1332
 
1333
1333
  ## Nuxt 2 to Nuxt 3+
1334
1334
 
@@ -54,21 +54,21 @@ export function useCookie<T = string | null | undefined> (
54
54
 
55
55
  Most of the options will be directly passed to the [cookie](https://github.com/jshttp/cookie) package.
56
56
 
57
- | Property | Type | Default | Description |
58
- | --- | --- | --- | --- |
59
- | `decode` | `(value: string) => T` | `decodeURIComponent` + [destr](https://github.com/unjs/destr). | Custom function to decode the cookie value. Since the value of a cookie has a limited character set (and must be a simple string), this function can be used to decode a previously encoded cookie value into a JavaScript string or other object. <br/> **Note:** If an error is thrown from this function, the original, non-decoded cookie value will be returned as the cookie's value. |
60
- | `encode` | `(value: T) => string` | `JSON.stringify` + `encodeURIComponent` | Custom function to encode the cookie value. Since the value of a cookie has a limited character set (and must be a simple string), this function can be used to encode a value into a string suited for a cookie's value. |
61
- | `default` | `() => T \| Ref<T>` | `undefined` | Function returning the default value if the cookie does not exist. The function can also return a `Ref`. |
62
- | `watch` | `boolean \| 'shallow'` | `true` | Whether to watch for changes and update the cookie. `true` for deep watch, `'shallow'` for shallow watch, i.e. data changes for only top level properties, `false` to disable. <br/> **Note:** Refresh `useCookie` values manually when a cookie has changed with [`refreshCookie`](/docs/4.x/api/utils/refresh-cookie). |
63
- | `readonly` | `boolean` | `false` | If `true`, disables writing to the cookie. |
64
- | `maxAge` | `number` | `undefined` | Max age in seconds for the cookie, i.e. the value for the [`Max-Age` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.2). The given number will be converted to an integer by rounding down. By default, no maximum age is set. |
65
- | `expires` | `Date` | `undefined` | Expiration date for the cookie. By default, no expiration is set. Most clients will consider this a "non-persistent cookie" and will delete it on a condition like exiting a web browser application. <br/> **Note:** The [cookie storage model specification](https://datatracker.ietf.org/doc/html/rfc6265#section-5.3) states that if both `expires` and `maxAge` is set, then `maxAge` takes precedence, but not all clients may obey this, so if both are set, they should point to the same date and time! <br/>If neither of `expires` and `maxAge` is set, the cookie will be session-only and removed when the user closes their browser. |
66
- | `httpOnly` | `boolean` | `false` | Sets the HttpOnly attribute. <br/> **Note:** Be careful when setting this to `true`, as compliant clients will not allow client-side JavaScript to see the cookie in `document.cookie`. |
67
- | `secure` | `boolean` | `false` | Sets the [`Secure` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.5). <br/>**Note:** Be careful when setting this to `true`, as compliant clients will not send the cookie back to the server in the future if the browser does not have an HTTPS connection. This can lead to hydration errors. |
68
- | `partitioned` | `boolean` | `false` | Sets the [`Partitioned` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/draft-cutler-httpbis-partitioned-cookies#section-2.1). <br/>**Note:** This is an attribute that has not yet been fully standardized, and may change in the future. <br/>This also means many clients may ignore this attribute until they understand it.<br/>More information can be found in the [proposal](https://github.com/privacycg/CHIPS). |
69
- | `domain` | `string` | `undefined` | Sets the [`Domain` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.3). By default, no domain is set, and most clients will consider applying the cookie only to the current domain. |
70
- | `path` | `string` | `'/'` | Sets the [`Path` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.4). By default, the path is considered the ["default path"](https://datatracker.ietf.org/doc/html/rfc6265#section-5.1.4). |
71
- | `sameSite` | `boolean \| string` | `undefined` | Sets the [`SameSite` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/draft-ietf-httpbis-rfc6265bis-03#section-4.1.2.7). <br/>- `true` will set the `SameSite` attribute to `Strict` for strict same-site enforcement.<br/>- `false` will not set the `SameSite` attribute.<br/>- `'lax'` will set the `SameSite` attribute to `Lax` for lax same-site enforcement.<br/>- `'none'` will set the `SameSite` attribute to `None` for an explicit cross-site cookie.<br/>- `'strict'` will set the `SameSite` attribute to `Strict` for strict same-site enforcement. |
57
+ | Property | Type | Default | Description |
58
+ |---------------|------------------------|----------------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
59
+ | `decode` | `(value: string) => T` | `decodeURIComponent` + [destr](https://github.com/unjs/destr). | Custom function to decode the cookie value. Since the value of a cookie has a limited character set (and must be a simple string), this function can be used to decode a previously encoded cookie value into a JavaScript string or other object. <br/> **Note:** If an error is thrown from this function, the original, non-decoded cookie value will be returned as the cookie's value. |
60
+ | `encode` | `(value: T) => string` | `JSON.stringify` + `encodeURIComponent` | Custom function to encode the cookie value. Since the value of a cookie has a limited character set (and must be a simple string), this function can be used to encode a value into a string suited for a cookie's value. |
61
+ | `default` | `() => T \| Ref<T>` | `undefined` | Function returning the default value if the cookie does not exist. The function can also return a `Ref`. |
62
+ | `watch` | `boolean \| 'shallow'` | `true` | Whether to watch for changes and update the cookie. `true` for deep watch, `'shallow'` for shallow watch, i.e. data changes for only top level properties, `false` to disable. <br/> **Note:** Refresh `useCookie` values manually when a cookie has changed with [`refreshCookie`](/docs/4.x/api/utils/refresh-cookie). |
63
+ | `readonly` | `boolean` | `false` | If `true`, disables writing to the cookie. |
64
+ | `maxAge` | `number` | `undefined` | Max age in seconds for the cookie, i.e. the value for the [`Max-Age` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.2). The given number will be converted to an integer by rounding down. By default, no maximum age is set. |
65
+ | `expires` | `Date` | `undefined` | Expiration date for the cookie. By default, no expiration is set. Most clients will consider this a "non-persistent cookie" and will delete it on a condition like exiting a web browser application. <br/> **Note:** The [cookie storage model specification](https://datatracker.ietf.org/doc/html/rfc6265#section-5.3) states that if both `expires` and `maxAge` is set, then `maxAge` takes precedence, but not all clients may obey this, so if both are set, they should point to the same date and time! <br/>If neither of `expires` and `maxAge` is set, the cookie will be session-only and removed when the user closes their browser. |
66
+ | `httpOnly` | `boolean` | `false` | Sets the HttpOnly attribute. <br/> **Note:** Be careful when setting this to `true`, as compliant clients will not allow client-side JavaScript to see the cookie in `document.cookie`. |
67
+ | `secure` | `boolean` | `false` | Sets the [`Secure` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.5). <br/>**Note:** Be careful when setting this to `true`, as compliant clients will not send the cookie back to the server in the future if the browser does not have an HTTPS connection. This can lead to hydration errors. |
68
+ | `partitioned` | `boolean` | `false` | Sets the [`Partitioned` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/draft-cutler-httpbis-partitioned-cookies#section-2.1). <br/>**Note:** This is an attribute that has not yet been fully standardized, and may change in the future. <br/>This also means many clients may ignore this attribute until they understand it.<br/>More information can be found in the [proposal](https://github.com/privacycg/CHIPS). |
69
+ | `domain` | `string` | `undefined` | Sets the [`Domain` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.3). By default, no domain is set, and most clients will consider applying the cookie only to the current domain. |
70
+ | `path` | `string` | `'/'` | Sets the [`Path` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/rfc6265#section-5.2.4). By default, the path is considered the ["default path"](https://datatracker.ietf.org/doc/html/rfc6265#section-5.1.4). |
71
+ | `sameSite` | `boolean \| string` | `undefined` | Sets the [`SameSite` `Set-Cookie` attribute](https://datatracker.ietf.org/doc/html/draft-ietf-httpbis-rfc6265bis-03#section-4.1.2.7). <br/>- `true` will set the `SameSite` attribute to `Strict` for strict same-site enforcement.<br/>- `false` will not set the `SameSite` attribute.<br/>- `'lax'` will set the `SameSite` attribute to `Lax` for lax same-site enforcement.<br/>- `'none'` will set the `SameSite` attribute to `None` for an explicit cross-site cookie.<br/>- `'strict'` will set the `SameSite` attribute to `Strict` for strict same-site enforcement. |
72
72
 
73
73
  ## Return Values
74
74
 
@@ -183,29 +183,29 @@ type AsyncDataRequestStatus = 'idle' | 'pending' | 'success' | 'error'
183
183
 
184
184
  - `options` (object): Configuration for the fetch request. Extends [unjs/ofetch](https://github.com/unjs/ofetch) options and [`AsyncDataOptions`](/docs/4.x/api/composables/use-async-data#params). All options can be a static value, a `ref`, or a computed value.
185
185
 
186
- | Option | Type | Default | Description |
187
- | ---| --- | --- | --- |
188
- | `key` | `MaybeRefOrGetter<string>` | auto-gen | Unique key for de-duplication. If not provided, generated from URL and options. |
189
- | `method` | `MaybeRefOrGetter<string>` | `'GET'` | HTTP request method. |
190
- | `query` | `MaybeRefOrGetter<SearchParams>` | - | Query/search params to append to the URL. Alias: `params`. |
191
- | `params` | `MaybeRefOrGetter<SearchParams>` | - | Alias for `query`. |
192
- | `body` | `MaybeRefOrGetter<RequestInit['body'] \| Record<string, any>>` | - | Request body. Objects are automatically stringified. |
193
- | `headers` | `MaybeRefOrGetter<Record<string, string> \| [key, value][] \| Headers>` | - | Request headers. |
194
- | `baseURL` | `MaybeRefOrGetter<string>` | - | Base URL for the request. |
195
- | `timeout` | `MaybeRefOrGetter<number>` | - | Timeout in milliseconds to abort the request. |
196
- | `cache` | `boolean \| string` | - | Cache control. Boolean disables cache, or use Fetch API values: `default`, `no-store`, etc. |
197
- | `server` | `boolean` | `true` | Whether to fetch on the server. |
198
- | `lazy` | `boolean` | `false` | If true, resolves after route loads (does not block navigation). |
199
- | `immediate` | `boolean` | `true` | If false, prevents request from firing immediately. |
200
- | `default` | `() => DataT` | - | Factory for default value of `data` before async resolves. |
201
- | `timeout` | `number` | - | A number in milliseconds to wait before timing out the request (defaults to `undefined`, which means no timeout) |
202
- | `transform` | `(input: DataT) => DataT \| Promise<DataT>` | - | Function to transform the result after resolving. |
203
- | `getCachedData`| `(key, nuxtApp, ctx) => DataT \| undefined` | - | Function to return cached data. See below for default. |
204
- | `pick` | `string[]` | - | Only pick specified keys from the result. |
205
- | `watch` | `MultiWatchSources \| false` | - | Array of reactive sources to watch and auto-refresh. `false` disables watching. |
206
- | `deep` | `boolean` | `false` | Return data in a deep ref object. |
207
- | `dedupe` | `'cancel' \| 'defer'` | `'cancel'` | Avoid fetching same key more than once at a time. |
208
- | `$fetch` | `typeof globalThis.$fetch` | - | Custom $fetch implementation. See [Custom useFetch in Nuxt](/docs/4.x/guide/recipes/custom-usefetch) |
186
+ | Option | Type | Default | Description |
187
+ |-----------------|-------------------------------------------------------------------------|------------|------------------------------------------------------------------------------------------------------------------|
188
+ | `key` | `MaybeRefOrGetter<string>` | auto-gen | Unique key for de-duplication. If not provided, generated from URL and options. |
189
+ | `method` | `MaybeRefOrGetter<string>` | `'GET'` | HTTP request method. |
190
+ | `query` | `MaybeRefOrGetter<SearchParams>` | - | Query/search params to append to the URL. Alias: `params`. |
191
+ | `params` | `MaybeRefOrGetter<SearchParams>` | - | Alias for `query`. |
192
+ | `body` | `MaybeRefOrGetter<RequestInit['body'] \| Record<string, any>>` | - | Request body. Objects are automatically stringified. |
193
+ | `headers` | `MaybeRefOrGetter<Record<string, string> \| [key, value][] \| Headers>` | - | Request headers. |
194
+ | `baseURL` | `MaybeRefOrGetter<string>` | - | Base URL for the request. |
195
+ | `timeout` | `MaybeRefOrGetter<number>` | - | Timeout in milliseconds to abort the request. |
196
+ | `cache` | `boolean \| string` | - | Cache control. Boolean disables cache, or use Fetch API values: `default`, `no-store`, etc. |
197
+ | `server` | `boolean` | `true` | Whether to fetch on the server. |
198
+ | `lazy` | `boolean` | `false` | If true, resolves after route loads (does not block navigation). |
199
+ | `immediate` | `boolean` | `true` | If false, prevents request from firing immediately. |
200
+ | `default` | `() => DataT` | - | Factory for default value of `data` before async resolves. |
201
+ | `timeout` | `number` | - | A number in milliseconds to wait before timing out the request (defaults to `undefined`, which means no timeout) |
202
+ | `transform` | `(input: DataT) => DataT \| Promise<DataT>` | - | Function to transform the result after resolving. |
203
+ | `getCachedData` | `(key, nuxtApp, ctx) => DataT \| undefined` | - | Function to return cached data. See below for default. |
204
+ | `pick` | `string[]` | - | Only pick specified keys from the result. |
205
+ | `watch` | `MultiWatchSources \| false` | - | Array of reactive sources to watch and auto-refresh. `false` disables watching. |
206
+ | `deep` | `boolean` | `false` | Return data in a deep ref object. |
207
+ | `dedupe` | `'cancel' \| 'defer'` | `'cancel'` | Avoid fetching same key more than once at a time. |
208
+ | `$fetch` | `typeof globalThis.$fetch` | - | Custom $fetch implementation. See [Custom useFetch in Nuxt](/docs/4.x/guide/recipes/custom-usefetch) |
209
209
 
210
210
  ::note
211
211
  All fetch options can be given a `computed` or `ref` value. These will be watched and new requests made automatically with any new values if they are updated.
@@ -222,14 +222,14 @@ This only caches data when `experimental.payloadExtraction` in `nuxt.config` is
222
222
 
223
223
  ## Return Values
224
224
 
225
- | Name | Type | Description |
226
- | --- | --- |--- |
227
- | `data` | `Ref<DataT \| undefined>` | The result of the asynchronous fetch. |
228
- | `refresh` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Function to manually refresh the data. By default, Nuxt waits until a `refresh` is finished before it can be executed again. |
229
- | `execute` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Alias for `refresh`. |
230
- | `error` | `Ref<ErrorT \| undefined>` | Error object if the data fetching failed. |
231
- | `status` | `Ref<'idle' \| 'pending' \| 'success' \| 'error'>` | Status of the data request. See below for possible values. |
232
- | `clear` | `() => void` | Resets `data` to `undefined` (or the value of `options.default()` if provided), `error` to `undefined`, set `status` to `idle`, and cancels any pending requests. |
225
+ | Name | Type | Description |
226
+ |-----------|-----------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------|
227
+ | `data` | `Ref<DataT \| undefined>` | The result of the asynchronous fetch. |
228
+ | `refresh` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Function to manually refresh the data. By default, Nuxt waits until a `refresh` is finished before it can be executed again. |
229
+ | `execute` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Alias for `refresh`. |
230
+ | `error` | `Ref<ErrorT \| undefined>` | Error object if the data fetching failed. |
231
+ | `status` | `Ref<'idle' \| 'pending' \| 'success' \| 'error'>` | Status of the data request. See below for possible values. |
232
+ | `clear` | `() => void` | Resets `data` to `undefined` (or the value of `options.default()` if provided), `error` to `undefined`, set `status` to `idle`, and cancels any pending requests. |
233
233
 
234
234
  ### Status values
235
235
 
@@ -69,14 +69,14 @@ export function useLazyFetch<DataT, ErrorT> (
69
69
 
70
70
  Returns the same `AsyncData` object as [`useFetch`](/docs/4.x/api/composables/use-fetch):
71
71
 
72
- | Name | Type | Description |
73
- | --- | --- |--- |
74
- | `data` | `Ref<DataT \| undefined>` | The result of the asynchronous fetch. |
75
- | `refresh` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Function to manually refresh the data. |
76
- | `execute` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Alias for `refresh`. |
77
- | `error` | `Ref<ErrorT \| undefined>` | Error object if the data fetching failed. |
78
- | `status` | `Ref<'idle' \| 'pending' \| 'success' \| 'error'>` | Status of the data request. |
79
- | `clear` | `() => void` | Resets `data` to `undefined`, `error` to `undefined`, sets `status` to `idle`, and cancels any pending requests. |
72
+ | Name | Type | Description |
73
+ |-----------|-----------------------------------------------------|------------------------------------------------------------------------------------------------------------------|
74
+ | `data` | `Ref<DataT \| undefined>` | The result of the asynchronous fetch. |
75
+ | `refresh` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Function to manually refresh the data. |
76
+ | `execute` | `(opts?: AsyncDataExecuteOptions) => Promise<void>` | Alias for `refresh`. |
77
+ | `error` | `Ref<ErrorT \| undefined>` | Error object if the data fetching failed. |
78
+ | `status` | `Ref<'idle' \| 'pending' \| 'success' \| 'error'>` | Status of the data request. |
79
+ | `clear` | `() => void` | Resets `data` to `undefined`, `error` to `undefined`, sets `status` to `idle`, and cancels any pending requests. |
80
80
 
81
81
  :read-more{to="/docs/4.x/api/composables/use-fetch#return-values"}
82
82
 
@@ -45,16 +45,16 @@ interface ObjectPlugin<T> {
45
45
  1. **Function Plugin**: A function that receives the [`NuxtApp`](/docs/4.x/guide/going-further/internals#the-nuxtapp-interface) instance and can return a promise with a potential object with a [`provide`](/docs/4.x/directory-structure/app/plugins#providing-helpers) property if you want to provide a helper on [`NuxtApp`](/docs/4.x/guide/going-further/internals#the-nuxtapp-interface) instance.
46
46
  2. **Object Plugin**: An object that can include various properties to configure the plugin's behavior, such as `name`, `enforce`, `dependsOn`, `order`, `parallel`, `setup`, `hooks`, and `env`.
47
47
 
48
- | Property | Type | Required | Description |
49
- | ------------------ | -------------------------------------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------------- |
50
- | `name` | `string` | `false` | Optional name for the plugin, useful for debugging and dependency management. |
51
- | `enforce` | `'pre'` \| `'default'` \| `'post'` | `false` | Controls when the plugin runs relative to other plugins. |
52
- | `dependsOn` | `string[]` | `false` | Array of plugin names this plugin depends on. Ensures proper execution order. |
53
- | `order` | `number` | `false` | This allows more granular control over plugin order and should only be used by advanced users. **It overrides the value of `enforce` and is used to sort plugins.** |
54
- | `parallel` | `boolean` | `false` | Whether to execute the plugin in parallel with other parallel plugins. |
55
- | `setup` | `Plugin<T>`{lang="ts"} | `false` | The main plugin function, equivalent to a function plugin. |
56
- | `hooks` | `Partial<RuntimeNuxtHooks>`{lang="ts"} | `false` | Nuxt app runtime hooks to register directly. |
57
- | `env` | `{ islands?: boolean }`{lang="ts"} | `false` | Set this value to `false` if you don't want the plugin to run when rendering server-only or island components. |
48
+ | Property | Type | Required | Description |
49
+ |-------------|----------------------------------------|----------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------|
50
+ | `name` | `string` | `false` | Optional name for the plugin, useful for debugging and dependency management. |
51
+ | `enforce` | `'pre'` \| `'default'` \| `'post'` | `false` | Controls when the plugin runs relative to other plugins. |
52
+ | `dependsOn` | `string[]` | `false` | Array of plugin names this plugin depends on. Ensures proper execution order. |
53
+ | `order` | `number` | `false` | This allows more granular control over plugin order and should only be used by advanced users. **It overrides the value of `enforce` and is used to sort plugins.** |
54
+ | `parallel` | `boolean` | `false` | Whether to execute the plugin in parallel with other parallel plugins. |
55
+ | `setup` | `Plugin<T>`{lang="ts"} | `false` | The main plugin function, equivalent to a function plugin. |
56
+ | `hooks` | `Partial<RuntimeNuxtHooks>`{lang="ts"} | `false` | Nuxt app runtime hooks to register directly. |
57
+ | `env` | `{ islands?: boolean }`{lang="ts"} | `false` | Set this value to `false` if you don't want the plugin to run when rendering server-only or island components. |
58
58
 
59
59
  :video-accordion{title="Watch a video from Alexander Lichter about the Object Syntax for Nuxt plugins" videoId="2aXZyXB1QGQ"}
60
60
 
@@ -217,14 +217,14 @@ An object accepting the following properties:
217
217
 
218
218
  - An object accepting the following properties:
219
219
 
220
- | Property | Type | Description |
221
- |----------|---------|--------------|
222
- | `popup` | `boolean` | Requests a minimal popup window instead of a new tab, with UI features decided by the browser. |
223
- | `width` or `innerWidth` | `number` | Specifies the content area's width (minimum 100 pixels), including scrollbars. |
224
- | `height` or `innerHeight` | `number` | Specifies the content area's height (minimum 100 pixels), including scrollbars. |
225
- | `left` or `screenX` | `number` | Sets the horizontal position of the new window relative to the left edge of the screen. |
226
- | `top` or `screenY` | `number` | Sets the vertical position of the new window relative to the top edge of the screen. |
227
- | `noopener` | `boolean` | Prevents the new window from accessing the originating window via `window.opener`. |
228
- | `noreferrer` | `boolean` | Prevents the Referer header from being sent and implicitly enables `noopener`. |
220
+ | Property | Type | Description |
221
+ |---------------------------|-----------|------------------------------------------------------------------------------------------------|
222
+ | `popup` | `boolean` | Requests a minimal popup window instead of a new tab, with UI features decided by the browser. |
223
+ | `width` or `innerWidth` | `number` | Specifies the content area's width (minimum 100 pixels), including scrollbars. |
224
+ | `height` or `innerHeight` | `number` | Specifies the content area's height (minimum 100 pixels), including scrollbars. |
225
+ | `left` or `screenX` | `number` | Sets the horizontal position of the new window relative to the left edge of the screen. |
226
+ | `top` or `screenY` | `number` | Sets the vertical position of the new window relative to the top edge of the screen. |
227
+ | `noopener` | `boolean` | Prevents the new window from accessing the originating window via `window.opener`. |
228
+ | `noreferrer` | `boolean` | Prevents the Referer header from being sent and implicitly enables `noopener`. |
229
229
 
230
230
  Refer to the [documentation](https://developer.mozilla.org/en-US/docs/Web/API/Window/open#windowfeatures) for more detailed information on the **windowFeatures** properties.
@@ -14,23 +14,23 @@ npx nuxt add <TEMPLATE> <NAME> [--cwd=<directory>] [--logLevel=<silent|info|verb
14
14
  ```
15
15
  <!--/add-cmd-->
16
16
 
17
- ### Arguments
17
+ ## Arguments
18
18
 
19
19
  <!--add-args-->
20
- Argument | Description
21
- --- | ---
22
- `TEMPLATE` | Specify which template to generate (options: <api\|app\|app-config\|component\|composable\|error\|layer\|layout\|middleware\|module\|page\|plugin\|server-middleware\|server-plugin\|server-route\|server-util>)
23
- `NAME` | Specify name of the generated file
20
+ | Argument | Description |
21
+ |------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
22
+ | `TEMPLATE` | Specify which template to generate (options: <api\|app\|app-config\|component\|composable\|error\|layer\|layout\|middleware\|module\|page\|plugin\|server-middleware\|server-plugin\|server-route\|server-util>) |
23
+ | `NAME` | Specify name of the generated file |
24
24
  <!--/add-args-->
25
25
 
26
26
  ### Options
27
27
 
28
28
  <!--add-opts-->
29
- Option | Default | Description
30
- --- | --- | ---
31
- `--cwd=<directory>` | `.` | Specify the working directory
32
- `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level
33
- `--force` | `false` | Force override file if it already exists
29
+ | Option | Default | Description |
30
+ |--------------------------------------|---------|------------------------------------------|
31
+ | `--cwd=<directory>` | `.` | Specify the working directory |
32
+ | `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level |
33
+ | `--force` | `false` | Force override file if it already exists |
34
34
  <!--/add-opts-->
35
35
 
36
36
  **Modifiers:**
@@ -19,22 +19,22 @@ The `analyze` command builds Nuxt and analyzes the production bundle (experiment
19
19
  ## Arguments
20
20
 
21
21
  <!--analyze-args-->
22
- Argument | Description
23
- --- | ---
24
- `ROOTDIR="."` | Specifies the working directory (default: `.`)
22
+ | Argument | Description |
23
+ |---------------|------------------------------------------------|
24
+ | `ROOTDIR="."` | Specifies the working directory (default: `.`) |
25
25
  <!--/analyze-args-->
26
26
 
27
27
  ## Options
28
28
 
29
29
  <!--analyze-opts-->
30
- Option | Default | Description
31
- --- | --- | ---
32
- `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`)
33
- `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level
34
- `--dotenv` | | Path to `.env` file to load, relative to the root directory
35
- `-e, --extends=<layer-name>` | | Extend from a Nuxt layer
36
- `--name=<name>` | `default` | Name of the analysis
37
- `--no-serve` | | Skip serving the analysis results
30
+ | Option | Default | Description |
31
+ |--------------------------------------|-----------|----------------------------------------------------------------------------------|
32
+ | `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`) |
33
+ | `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level |
34
+ | `--dotenv` | | Path to `.env` file to load, relative to the root directory |
35
+ | `-e, --extends=<layer-name>` | | Extend from a Nuxt layer |
36
+ | `--name=<name>` | `default` | Name of the analysis |
37
+ | `--no-serve` | | Skip serving the analysis results |
38
38
  <!--/analyze-opts-->
39
39
 
40
40
  ::note
@@ -19,22 +19,22 @@ The `build-module` command runs `@nuxt/module-builder` to generate `dist` direct
19
19
  ## Arguments
20
20
 
21
21
  <!--build-module-args-->
22
- Argument | Description
23
- --- | ---
24
- `ROOTDIR="."` | Specifies the working directory (default: `.`)
22
+ | Argument | Description |
23
+ |---------------|------------------------------------------------|
24
+ | `ROOTDIR="."` | Specifies the working directory (default: `.`) |
25
25
  <!--/build-module-args-->
26
26
 
27
27
  ## Options
28
28
 
29
29
  <!--build-module-opts-->
30
- Option | Default | Description
31
- --- | --- | ---
32
- `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`)
33
- `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level
34
- `--build` | `false` | Build module for distribution
35
- `--stub` | `false` | Stub dist instead of actually building it for development
36
- `--sourcemap` | `false` | Generate sourcemaps
37
- `--prepare` | `false` | Prepare module for local development
30
+ | Option | Default | Description |
31
+ |--------------------------------------|---------|----------------------------------------------------------------------------------|
32
+ | `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`) |
33
+ | `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level |
34
+ | `--build` | `false` | Build module for distribution |
35
+ | `--stub` | `false` | Stub dist instead of actually building it for development |
36
+ | `--sourcemap` | `false` | Generate sourcemaps |
37
+ | `--prepare` | `false` | Prepare module for local development |
38
38
  <!--/build-module-opts-->
39
39
 
40
40
  ::read-more{to="https://github.com/nuxt/module-builder" icon="i-simple-icons-github" target="\_blank"}
@@ -19,23 +19,23 @@ The `build` command creates a `.output` directory with all your application, ser
19
19
  ## Arguments
20
20
 
21
21
  <!--build-args-->
22
- Argument | Description
23
- --- | ---
24
- `ROOTDIR="."` | Specifies the working directory (default: `.`)
22
+ | Argument | Description |
23
+ |---------------|------------------------------------------------|
24
+ | `ROOTDIR="."` | Specifies the working directory (default: `.`) |
25
25
  <!--/build-args-->
26
26
 
27
27
  ## Options
28
28
 
29
29
  <!--build-opts-->
30
- Option | Default | Description
31
- --- | --- | ---
32
- `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`)
33
- `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level
34
- `--prerender` | | Build Nuxt and prerender static routes
35
- `--preset` | | Nitro server preset
36
- `--dotenv` | | Path to `.env` file to load, relative to the root directory
37
- `--envName` | | The environment to use when resolving configuration overrides (default is `production` when building, and `development` when running the dev server)
38
- `-e, --extends=<layer-name>` | | Extend from a Nuxt layer
30
+ | Option | Default | Description |
31
+ |--------------------------------------|---------|------------------------------------------------------------------------------------------------------------------------------------------------------|
32
+ | `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`) |
33
+ | `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level |
34
+ | `--prerender` | | Build Nuxt and prerender static routes |
35
+ | `--preset` | | Nitro server preset |
36
+ | `--dotenv` | | Path to `.env` file to load, relative to the root directory |
37
+ | `--envName` | | The environment to use when resolving configuration overrides (default is `production` when building, and `development` when running the dev server) |
38
+ | `-e, --extends=<layer-name>` | | Extend from a Nuxt layer |
39
39
  <!--/build-opts-->
40
40
 
41
41
  ::note
@@ -24,15 +24,15 @@ The `cleanup` command removes common generated Nuxt files and caches, including:
24
24
  ## Arguments
25
25
 
26
26
  <!--cleanup-args-->
27
- Argument | Description
28
- --- | ---
29
- `ROOTDIR="."` | Specifies the working directory (default: `.`)
27
+ | Argument | Description |
28
+ |---------------|------------------------------------------------|
29
+ | `ROOTDIR="."` | Specifies the working directory (default: `.`) |
30
30
  <!--/cleanup-args-->
31
31
 
32
32
  ## Options
33
33
 
34
34
  <!--cleanup-opts-->
35
- Option | Default | Description
36
- --- | --- | ---
37
- `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`)
35
+ | Option | Default | Description |
36
+ |---------------------|---------|----------------------------------------------------------------------------------|
37
+ | `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`) |
38
38
  <!--/cleanup-opts-->
@@ -19,34 +19,34 @@ The `dev` command starts a development server with hot module replacement at [ht
19
19
  ## Arguments
20
20
 
21
21
  <!--dev-args-->
22
- Argument | Description
23
- --- | ---
24
- `ROOTDIR="."` | Specifies the working directory (default: `.`)
22
+ | Argument | Description |
23
+ |---------------|------------------------------------------------|
24
+ | `ROOTDIR="."` | Specifies the working directory (default: `.`) |
25
25
  <!--/dev-args-->
26
26
 
27
27
  ## Options
28
28
 
29
29
  <!--dev-opts-->
30
- Option | Default | Description
31
- --- | --- | ---
32
- `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`)
33
- `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level
34
- `--dotenv` | | Path to `.env` file to load, relative to the root directory
35
- `--envName` | | The environment to use when resolving configuration overrides (default is `production` when building, and `development` when running the dev server)
36
- `-e, --extends=<layer-name>` | | Extend from a Nuxt layer
37
- `--clear` | `false` | Clear console on restart
38
- `--no-f, --no-fork` | | Disable forked mode
39
- `-p, --port` | | Port to listen on (default: `NUXT_PORT \|\| NITRO_PORT \|\| PORT \|\| nuxtOptions.devServer.port`)
40
- `-h, --host` | | Host to listen on (default: `NUXT_HOST \|\| NITRO_HOST \|\| HOST \|\| nuxtOptions.devServer?.host`)
41
- `--clipboard` | `false` | Copy the URL to the clipboard
42
- `-o, --open` | `false` | Open the URL in the browser
43
- `--https` | | Enable HTTPS
44
- `--publicURL` | | Displayed public URL (used for QR code)
45
- `--qr` | | Display The QR code of public URL when available
46
- `--public` | | Listen to all network interfaces
47
- `--tunnel` | | Open a tunnel using https://github.com/unjs/untun
48
- `--sslCert` | | (DEPRECATED) Use `--https.cert` instead.
49
- `--sslKey` | | (DEPRECATED) Use `--https.key` instead.
30
+ | Option | Default | Description |
31
+ |--------------------------------------|---------|------------------------------------------------------------------------------------------------------------------------------------------------------|
32
+ | `--cwd=<directory>` | | Specify the working directory, this takes precedence over ROOTDIR (default: `.`) |
33
+ | `--logLevel=<silent\|info\|verbose>` | | Specify build-time log level |
34
+ | `--dotenv` | | Path to `.env` file to load, relative to the root directory |
35
+ | `--envName` | | The environment to use when resolving configuration overrides (default is `production` when building, and `development` when running the dev server) |
36
+ | `-e, --extends=<layer-name>` | | Extend from a Nuxt layer |
37
+ | `--clear` | `false` | Clear console on restart |
38
+ | `--no-f, --no-fork` | | Disable forked mode |
39
+ | `-p, --port` | | Port to listen on (default: `NUXT_PORT \|\| NITRO_PORT \|\| PORT \|\| nuxtOptions.devServer.port`) |
40
+ | `-h, --host` | | Host to listen on (default: `NUXT_HOST \|\| NITRO_HOST \|\| HOST \|\| nuxtOptions.devServer?.host`) |
41
+ | `--clipboard` | `false` | Copy the URL to the clipboard |
42
+ | `-o, --open` | `false` | Open the URL in the browser |
43
+ | `--https` | | Enable HTTPS |
44
+ | `--publicURL` | | Displayed public URL (used for QR code) |
45
+ | `--qr` | | Display The QR code of public URL when available |
46
+ | `--public` | | Listen to all network interfaces |
47
+ | `--tunnel` | | Open a tunnel using https://github.com/unjs/untun |
48
+ | `--sslCert` | | (DEPRECATED) Use `--https.cert` instead. |
49
+ | `--sslKey` | | (DEPRECATED) Use `--https.key` instead. |
50
50
  <!--/dev-opts-->
51
51
 
52
52
  The port and host can also be set via NUXT_PORT, PORT, NUXT_HOST or HOST environment variables.