A good chunk of this release is (hopefully) invisible plumbing for Nuxt 5. We've moved onto the latest major versions of several core dependencies (unhead v3, unctx v3, and Vite 8), switched the framework's own build over to tsdown, and introduced a stable nuxt/* build output contract with dev exports so that type-checking in the Nuxt monorepo works without a build step (#35463, #35605).
Much of this is working to shrink the gap between v4 and v5 internally, so that the migration will be as boring as possible.
[!TIP]
If you want to test some of the breaking changes of Nuxt v5, you can already opt in with future.compatibilityVersion: 5. Keep an eye on the Upgrade Guide for details as they land.
With the release of Nuxt v4.5, our focus as a team will turn to stabilising Nuxt v5 and creating compatibility utilities to make the upgrade as smooth as possible.
Nuxt 3 End-of-Life
Nuxt 3 reaches end-of-life on July 31, 2026, so this is one of the last few 3.x releases we'll ship. If you're still on v3, now is a great time to move across. Most people told us the v3 to v4 upgrade was smooth, and we've kept the upgrade guide up to date.
Alongside v4.5.0 we're publishing a maintenance patch for the 3.x line (v3.21.9) with the compatible bug fixes and smaller improvements from this release backported. The headline items here (Vite 8, Rspack 2, unhead v3, unctx v3) are major upgrades and stay v4-only, so 3.x remains stable as it approaches end-of-life.
👀 Highlights
Nuxt 4.5 is a big one. This release ships three major upgrades to the build layer (Vite 8, Rspack 2, and a brand new Rsbuild-powered pipeline for the Rspack builder), an experimental SSR streaming mode, a handful of new composables and conventions, and a lot of groundwork that brings us closer to Nuxt 5.
There's a lot here, so grab a coffee. ☕️
⚡️ Vite 8
Nuxt now runs on Vite 8 (#34256). This brings faster cold starts, the latest Rolldown-powered internals, and many upstream improvements from the Vite team.
For most apps this is a transparent upgrade. If you have custom Vite plugins or config, it's worth skimming the Vite migration guide to check for anything that affects you.
[!WARNING]
Vite 8 is a major version bump. If you depend on Vite directly (custom plugins, vite.config tweaks, or ecosystem plugins that pin a Vite version), make sure those are compatible before upgrading in production.
🦀 Rspack 2 and Rsbuild
If you use the Rspack builder, this release is a substantial upgrade. We've moved to Rspack 2 (#34929), which is faster and lighter, and rebuilt the builder on top of @rsbuild/core (#35489).
The public surface stays the same. You still opt in with builder: 'rspack' and the existing rspack:* hooks continue to work:
Under the hood, though, a lot has changed for the better:
The dev server now runs in middleware mode via Rsbuild, replacing webpack-dev-middleware and webpack-hot-middleware (#35575).
We use an Rspack-specific Vue loader for correct SSR scoped-style ids and stricter ESM resolution (#35566).
[!NOTE]
This is the foundation for first-class Rsbuild support. We kept the builder named rspack for now so nothing breaks, but the internals are now Rsbuild all the way down.
🌊 Experimental SSR Streaming
This is one I'm particularly excited about. You can now enable SSR streaming to dramatically improve Time to First Byte (#34411). Instead of buffering the whole rendered page and sending it in one go, Nuxt flushes the HTML shell (your <head>, styles, preload hints, and entry scripts) immediately, then streams the body as Vue renders it.
Streaming is automatically disabled for bots and crawlers so search engines still receive fully-rendered HTML. You can tune which user agents count as crawlers, and you can opt individual routes out:
There's one thing worth understanding before you turn it on. Because streaming commits the HTTP status and headers with the very first byte, anything that mutates the response after rendering has begun (a setResponseStatus() in a <script setup>, a cookie write during middleware, and so on) can't reach the client. Nuxt handles the common cases for you: routes with redirect, cache, isr, swr, noScripts, or ssr: false rules automatically fall back to the buffered renderer, and in development we log a warning naming any dropped mutations so nothing fails silently.
[!WARNING]
SSR streaming is experimental and off by default. It could be great for content-heavy routes where TTFB matters, but test it against your app's response-mutating logic (status codes, headers, cookies) before shipping it widely. The experimental features docs cover the fallback rules and caveats in detail.
This one I'm really happy about. Nuxt now has a stable error code system (#35429). Warnings and errors raised during build and at runtime now carry a stable code (like NUXT_E1001 or NUXT_B5001), a short explanation of why it happened, and a concrete fix to try.
Every code is greppable and bookmarkable, and the ones that need more than a one-line fix link straight to a dedicated docs page. For example, the classic "a composable was called outside a Nuxt context" now surfaces as NUXT_E1001 with the why/fix inline and a docs page explaining the context rules and how to use runWithContext().
To keep production output lean, the verbose why/fix text is stripped from production builds, leaving just the stable code.
This is the foundation for much better error messages across Nuxt, and we'll keep migrating existing warnings and errors onto it over the coming releases. If you've ever squinted at a cryptic Nuxt message, this is for you.
🎨useLayout Composable
There's a new useLayout composable for reading the layout that's been resolved for the current route (#35623). Previously there was no clean, reactive way to ask "which layout is this page using?" from within a component.
Nuxt now supports named views through a filename convention (#35123). If a parent page renders more than one <NuxtPage> outlet, you can give each outlet a name and provide a sibling page file for it using the name@view.vue convention:
Navigating to /parent/child renders child.vue into the default outlet and child@sidebar.vue into the sidebar outlet. This has actually been possible in Vue Router for a long time; this release wires it up to Nuxt's file-based routing.
[!NOTE] definePageMeta is read from the default route file only, and per-view rendering modes aren't supported (the parent page's mode applies to the default view).
You can now gate data fetching with a reactive enabled option (#33260). While enabled is false, every execution is blocked (the initial fetch, execute/refresh, and watch triggers), and if you flip it from true to false mid-flight, the in-flight request is cancelled without clearing your existing data.
<scriptsetuplang="ts">constquery=ref('')const{data}=awaituseFetch('/api/search',{query:{q:query},// Only fetch once the user has typed something
enabled:()=>query.value.length>2,})</script>
This is perfect for dependent or conditional queries, where you don't want to fire a request until some precondition is met. It pairs naturally with a getter or a ref, so it stays reactive.
When you use <NuxtLink> with the custom prop, Nuxt no longer attaches prefetch handlers for you, because it can't know how you've structured your markup. To make that ergonomic, the slot now exposes everything you need to wire prefetching up yourself (#34539):
You get prefetch to trigger it, prefetched to know whether it's already happened (great for a prefetched class), and shouldPrefetch to respect the user's connection and config.
Here's another one we'd love you to try. When you prefetch a link to a route with payload extraction, Nuxt already primes the destination's data and chunks. With the new opt-in experimental.prefetchPreloadTags (#35144), it also forwards the destination's <link rel="preload"> and modulepreload hints (whatever the page sets via useHead, or via modules like @nuxt/image's <NuxtImg preload>) into the current document, downgraded to rel="prefetch" so they don't compete with the resources the user is looking at right now.
The practical effect is that heavy above-the-fold assets on the next page (a hero image, a critical script) start downloading while the user is still on the current one, so the navigation feels instant. It's off by default while we gather feedback, so please give it a spin and tell us how it behaves on your app.
🌐import.meta.envName
The resolved Nuxt environment name is now available at runtime as import.meta.envName for both Vite and webpack/Rspack builds (#34844). This is the value set by --envName (or the resolved default), so you can branch on it in your app code:
Nuxt now publishes diagnostics-channel traces for its server-side subsystems (#35191). It's unopinionated: we emit nuxt.render, nuxt.island, nuxt.data, and nuxt.plugin channels following the untracing naming convention, and you can build OpenTelemetry (or anything else) on top. It works in Node, Deno, Bun, and Cloudflare Workers.
// nuxt.config.ts
exportdefaultdefineNuxtConfig({// Turn on Nuxt's own channels
tracingChannel: true,})
You can also enable it granularly. In Nuxt v5, there will be additional Nitro-level channels:
[!NOTE]
Channel names, payload shapes, and option keys may still change while the untracing registry settles.
📦 Dependency Upgrades
unhead v3
Nuxt's head management now runs on unhead v3 (#34793). It's smaller, uses a synchronous engine internally, and ships better type-safety for useHead out of the box. This also unblocks SSR streaming.
[!WARNING] unhead v3 introduces type-narrowing for useHead, which can be a breaking type change if you were relying on the looser v2 types. The runtime behaviour is compatible for the vast majority of apps, and promise input (deprecated in v2) is no longer supported. If you hit type errors after upgrading, they're almost always genuine tightening rather than regressions.
unctx v3
We've moved to unctx v3 (#35541), which resolves a class of long-standing async context issues (#33644). This is part of the composable-context reliability work that continues into v5.
And more
We've also updated magic-string to v1, Babel to v8, and pulled in the latest Rolldown across the board. Running nuxt upgrade --dedupe (see below) is the easiest way to pull these through cleanly.
🛠️ Nuxt CLI
This release bundles some improvements from @nuxt/cli v3.36 and v3.37:
nuxt module remove to uninstall a module and clean up its config (nuxt/cli#1306), the natural companion to nuxt module add.
Non-interactive nuxt init for scripting and CI (nuxt/cli#1341), plus it now respects the template's own package manager instead of prompting (nuxt/cli#1330).
Type-check onboarding: nuxt typecheck now offers to install vue-tsc and typescript for you if they're missing (nuxt/cli#1316).
Golar support for type-checking: nuxt typecheck can now use Golar as an alternative to vue-tsc (nuxt/cli#1362). It's picked up automatically if it's installed (or a golar.config.* file exists), and you can force a checker with --checker=vue-tsc or --checker=golar:
nuxt typecheck --checker=golar
Layer-aware dev server: the dev server now reloads on changes to local layer nuxt.config files (nuxt/cli#1345).
🧩 TypeScript Plugin and Named Layout Slots
Nuxt's experimental TypeScript plugin is powered by @dxup/nuxt, and this release bundles a newer version of it. If you haven't tried it, turning on experimental.typescriptPlugin gives you a set of editor niceties: renaming an auto-imported component updates every usage, plus go-to-definition for glob imports, Nitro routes, definePageMeta, runtimeConfig, and typed route names.
New in the bundled version is an opt-in runtime feature: named layout slots (KazariEX/dxup#20). You can write a top-level named-slot template in a page and have it forwarded into the matching named slot of the active layout. That lets a page inject content into its layout's slots, which file-based layouts don't otherwise allow.
<!--pages/about.vue--><scriptsetuplang="ts">definePageMeta({layout:'center'})</script><template><template#side="{ one }">This"{{ one }}"comesfromthelayoutslot.</template><div>Aboutpage</div></template>
As always, a lot of work has gone into making Nuxt faster and steadier.
One you can opt into today is the shared file watcher (#35143). Vite already runs a chokidar-based watcher, so Nuxt can piggy-back on it instead of spinning up a second one, using less memory and fewer file handles. This becomes the default with compatibilityVersion: 5, but you can turn it on now and let us know how it goes:
There are also some other good performance improvements that don't need to be opted into:
Faster dev startup: dev-only Nitro and pages work is now deferred and streamlined (#35381, #35383).
Leaner production builds: the island-renderer chunk is skipped entirely when you use no islands (#35456), and plugin handling is tree-shaken out of prod builds (#35278).
Improved island hashing: more stable island and key hashing, with getIslandHash and hashKey now exposed (#35583).
Concurrency and I/O wins across Kit path resolution and Nitro inline styles (#35511, #35514).
A couple of other nice quality-of-life fixes:
$fetch is now auto-imported in user code, which fixes edge cases with top-level $fetch.create under Rolldown's output format (#35581).
Nuxt now honours system HTTP_PROXY / HTTPS_PROXY environment variables in the builder environment (#35183).
HMR now works for defineNuxtComponent in JSX (#35620).
⚠️ Heads-Up Before Upgrading
As mentioned above, this release includes three major dependency bumps. For most apps they're transparent, but they're worth a moment of attention:
Rspack 2: if you use builder: 'rspack', the internals are now Rsbuild-based, so custom Rspack config may need review.
unhead v3: possible breaking type changes from stricter useHead typing.
⬆️ Upgrading
Our recommendation for upgrading is to run:
npx nuxt upgrade --dedupe
# or, if you are staying on the 3.x line
npx nuxt@latest upgrade --dedupe --channel=v3
This will deduplicate your lockfile and help ensure you pull in updates from the other dependencies Nuxt relies on, particularly across the unjs ecosystem (which matters more than usual this release, given the major bumps).
[!TIP]
Check out our upgrade guide if you're upgrading from an older version.
Thank you to all of the many contributors to this release. This was a big one, and it wouldn't happen without you. 💚
This PR contains the following updates:
| Package | Change | [Age](https://docs.renovatebot.com/merge-confidence/) | [Confidence](https://docs.renovatebot.com/merge-confidence/) |
|---|---|---|---|
| [nuxt](https://nuxt.com) ([source](https://github.com/nuxt/nuxt/tree/HEAD/packages/nuxt)) | [`4.4.8` → `4.5.0`](https://renovatebot.com/diffs/npm/nuxt/4.4.8/4.5.0) |  |  |
---
### Release Notes
<details>
<summary>nuxt/nuxt (nuxt)</summary>
### [`v4.5.0`](https://github.com/nuxt/nuxt/releases/tag/v4.5.0)
[Compare Source](https://github.com/nuxt/nuxt/compare/v4.4.8...v4.5.0)
> 4.5.0 is the next minor release.
#### 📣 Some News
##### Preparing for Nuxt 5
A good chunk of this release is (hopefully) invisible plumbing for Nuxt 5. We've moved onto the latest major versions of several core dependencies (`unhead` v3, `unctx` v3, and Vite 8), switched the framework's own build over to [`tsdown`](https://github.com/nuxt/nuxt/pull/35179), and introduced a stable `nuxt/*` build output contract with dev exports so that type-checking in the Nuxt monorepo works without a build step ([#​35463](https://github.com/nuxt/nuxt/issues/35463), [#​35605](https://github.com/nuxt/nuxt/issues/35605)).
Much of this is working to shrink the gap between v4 and v5 internally, so that the migration will be as boring as possible.
> \[!TIP]
> If you want to test some of the breaking changes of Nuxt v5, you can already opt in with `future.compatibilityVersion: 5`. Keep an eye on the [Upgrade Guide](https://nuxt.com/docs/getting-started/upgrade) for details as they land.
With the release of Nuxt v4.5, our focus as a team will turn to stabilising Nuxt v5 and creating compatibility utilities to make the upgrade as smooth as possible.
##### Nuxt 3 End-of-Life
Nuxt 3 reaches end-of-life on **July 31, 2026**, so this is one of the last few 3.x releases we'll ship. If you're still on v3, now is a great time to move across. Most people told us the v3 to v4 upgrade was smooth, and we've kept the [upgrade guide](https://nuxt.com/docs/getting-started/upgrade) up to date.
Alongside v4.5.0 we're publishing a maintenance patch for the 3.x line (**v3.21.9**) with the compatible bug fixes and smaller improvements from this release backported. The headline items here (Vite 8, Rspack 2, `unhead` v3, `unctx` v3) are major upgrades and stay v4-only, so 3.x remains stable as it approaches end-of-life.
#### 👀 Highlights
Nuxt 4.5 is a big one. This release ships three major upgrades to the build layer (Vite 8, Rspack 2, and a brand new Rsbuild-powered pipeline for the Rspack builder), an experimental SSR streaming mode, a handful of new composables and conventions, and a lot of groundwork that brings us closer to Nuxt 5.
There's a lot here, so grab a coffee. ☕️
##### ⚡️ Vite 8
Nuxt now runs on [Vite 8](https://vite.dev) ([#​34256](https://github.com/nuxt/nuxt/issues/34256)). This brings faster cold starts, the latest Rolldown-powered internals, and many upstream improvements from the Vite team.
For most apps this is a transparent upgrade. If you have custom Vite plugins or config, it's worth skimming the [Vite migration guide](https://vite.dev/guide/migration) to check for anything that affects you.
> \[!WARNING]
> Vite 8 is a major version bump. If you depend on Vite directly (custom plugins, `vite.config` tweaks, or ecosystem plugins that pin a Vite version), make sure those are compatible before upgrading in production.
##### 🦀 Rspack 2 and Rsbuild
If you use the Rspack builder, this release is a substantial upgrade. We've moved to [Rspack 2](https://www.rspack.dev/blog/announcing-2-0) ([#​34929](https://github.com/nuxt/nuxt/issues/34929)), which is faster and lighter, and rebuilt the builder on top of [`@rsbuild/core`](https://rsbuild.dev) ([#​35489](https://github.com/nuxt/nuxt/issues/35489)).
The public surface stays the same. You still opt in with `builder: 'rspack'` and the existing `rspack:*` hooks continue to work:
```ts
// nuxt.config.ts
export default defineNuxtConfig({
builder: 'rspack',
})
```
Under the hood, though, a lot has changed for the better:
- The dev server now runs in middleware mode via Rsbuild, replacing `webpack-dev-middleware` and `webpack-hot-middleware` ([#​35575](https://github.com/nuxt/nuxt/issues/35575)).
- We use an Rspack-specific Vue loader for correct SSR scoped-style ids and stricter ESM resolution ([#​35566](https://github.com/nuxt/nuxt/issues/35566)).
> \[!NOTE]
> This is the foundation for first-class Rsbuild support. We kept the builder named `rspack` for now so nothing breaks, but the internals are now Rsbuild all the way down.
##### 🌊 Experimental SSR Streaming
This is one I'm particularly excited about. You can now enable **SSR streaming** to dramatically improve Time to First Byte ([#​34411](https://github.com/nuxt/nuxt/issues/34411)). Instead of buffering the whole rendered page and sending it in one go, Nuxt flushes the HTML shell (your `<head>`, styles, preload hints, and entry scripts) immediately, then streams the body as Vue renders it.
```ts
// nuxt.config.ts
export default defineNuxtConfig({
experimental: {
ssrStreaming: true,
},
})
```
Streaming is automatically disabled for bots and crawlers so search engines still receive fully-rendered HTML. You can tune which user agents count as crawlers, and you can opt individual routes out:
```ts
// nuxt.config.ts
export default defineNuxtConfig({
experimental: {
ssrStreaming: {
botRegex: /googlebot|bingbot|my-internal-crawler/i,
},
},
routeRules: {
'/no-stream/**': { streaming: false },
},
})
```
There's one thing worth understanding before you turn it on. Because streaming commits the HTTP status and headers with the very first byte, anything that mutates the response *after* rendering has begun (a `setResponseStatus()` in a `<script setup>`, a cookie write during middleware, and so on) can't reach the client. Nuxt handles the common cases for you: routes with `redirect`, `cache`, `isr`, `swr`, `noScripts`, or `ssr: false` rules automatically fall back to the buffered renderer, and in development we log a warning naming any dropped mutations so nothing fails silently.
> \[!WARNING]
> SSR streaming is experimental and off by default. It could be great for content-heavy routes where TTFB matters, but test it against your app's response-mutating logic (status codes, headers, cookies) before shipping it widely. The [experimental features docs](https://nuxt.com/docs/guide/going-further/experimental-features#ssrstreaming) cover the fallback rules and caveats in detail.
📖 [SSR streaming documentation](https://nuxt.com/docs/guide/going-further/experimental-features#ssrstreaming)
##### 🩺 Stable Error Codes
This one I'm really happy about. Nuxt now has a **stable error code system** ([#​35429](https://github.com/nuxt/nuxt/issues/35429)). Warnings and errors raised during build and at runtime now carry a stable code (like `NUXT_E1001` or `NUXT_B5001`), a short explanation of **why** it happened, and a concrete **fix** to try.
Every code is greppable and bookmarkable, and the ones that need more than a one-line fix link straight to a dedicated docs page. For example, the classic "a composable was called outside a Nuxt context" now surfaces as `NUXT_E1001` with the why/fix inline and a [docs page](https://nuxt.com/docs/errors/e1001) explaining the context rules and how to use `runWithContext()`.
To keep production output lean, the verbose why/fix text is stripped from production builds, leaving just the stable code.
This is the foundation for much better error messages across Nuxt, and we'll keep migrating existing warnings and errors onto it over the coming releases. If you've ever squinted at a cryptic Nuxt message, this is for you.
##### 🎨 `useLayout` Composable
There's a new `useLayout` composable for reading the layout that's been resolved for the current route ([#​35623](https://github.com/nuxt/nuxt/issues/35623)). Previously there was no clean, reactive way to ask "which layout is this page using?" from within a component.
```vue
<!-- app/components/LayoutBadge.vue -->
<script setup lang="ts">
const layout = useLayout()
</script>
<template>
<span>Current layout: {{ layout }}</span>
</template>
```
It returns a read-only computed ref, so it stays in sync as you navigate or as route rules and `definePageMeta` change the resolved layout.
📖 [`useLayout` documentation](https://nuxt.com/docs/api/composables/use-layout)
##### 🪟 Named Views
Nuxt now supports **named views** through a filename convention ([#​35123](https://github.com/nuxt/nuxt/issues/35123)). If a parent page renders more than one `<NuxtPage>` outlet, you can give each outlet a name and provide a sibling page file for it using the `name@view.vue` convention:
```bash
# Directory Structure
-| pages/
---| parent/
-----| child.vue
-----| child@sidebar.vue
---| parent.vue
```
```vue
<!-- pages/parent.vue -->
<template>
<div>
<NuxtPage />
<aside>
<NuxtPage name="sidebar" />
</aside>
</div>
</template>
```
Navigating to `/parent/child` renders `child.vue` into the default outlet and `child@sidebar.vue` into the `sidebar` outlet. This has actually been possible in Vue Router for a long time; this release wires it up to Nuxt's file-based routing.
> \[!NOTE]
> `definePageMeta` is read from the default route file only, and per-view rendering modes aren't supported (the parent page's mode applies to the default view).
📖 [Named views documentation](https://nuxt.com/docs/guide/directory-structure/app/pages#named-views)
##### 🚦 `enabled` Option for `useFetch` and `useAsyncData`
You can now gate data fetching with a reactive `enabled` option ([#​33260](https://github.com/nuxt/nuxt/pull/33260)). While `enabled` is `false`, every execution is blocked (the initial fetch, `execute`/`refresh`, and watch triggers), and if you flip it from `true` to `false` mid-flight, the in-flight request is cancelled without clearing your existing `data`.
```vue [app/pages/search.vue]
<script setup lang="ts">
const query = ref('')
const { data } = await useFetch('/api/search', {
query: { q: query },
// Only fetch once the user has typed something
enabled: () => query.value.length > 2,
})
</script>
```
This is perfect for dependent or conditional queries, where you don't want to fire a request until some precondition is met. It pairs naturally with a getter or a ref, so it stays reactive.
📖 [`useAsyncData` documentation](https://nuxt.com/docs/api/composables/use-async-data)
##### 🔗 `NuxtLink` Prefetch Control for Custom Slots
When you use `<NuxtLink>` with the `custom` prop, Nuxt no longer attaches prefetch handlers for you, because it can't know how you've structured your markup. To make that ergonomic, the slot now exposes everything you need to wire prefetching up yourself ([#​34539](https://github.com/nuxt/nuxt/issues/34539)):
```vue
<template>
<NuxtLink
v-slot="{ href, navigate, prefetch, prefetched, shouldPrefetch }"
to="/about"
custom
>
<a
:href="href"
:class="{ 'is-prefetched': prefetched }"
@​click="navigate"
@​pointerenter="shouldPrefetch('interaction') && prefetch()"
@​focus="shouldPrefetch('interaction') && prefetch()"
>
About page
</a>
</NuxtLink>
</template>
```
You get `prefetch` to trigger it, `prefetched` to know whether it's already happened (great for a prefetched class), and `shouldPrefetch` to respect the user's connection and config.
📖 [`NuxtLink` documentation](https://nuxt.com/docs/api/components/nuxt-link)
##### ⚡️ Forwarded Preload Hints on Prefetch
Here's another one we'd love you to try. When you prefetch a link to a route with payload extraction, Nuxt already primes the destination's data and chunks. With the new opt-in `experimental.prefetchPreloadTags` ([#​35144](https://github.com/nuxt/nuxt/issues/35144)), it also forwards the destination's `<link rel="preload">` and `modulepreload` hints (whatever the page sets via `useHead`, or via modules like `@nuxt/image`'s `<NuxtImg preload>`) into the *current* document, downgraded to `rel="prefetch"` so they don't compete with the resources the user is looking at right now.
```ts
// nuxt.config.ts
export default defineNuxtConfig({
experimental: {
prefetchPreloadTags: true,
},
})
```
The practical effect is that heavy above-the-fold assets on the *next* page (a hero image, a critical script) start downloading while the user is still on the current one, so the navigation feels instant. It's off by default while we gather feedback, so please give it a spin and tell us how it behaves on your app.
##### 🌐 `import.meta.envName`
The resolved Nuxt environment name is now available at runtime as `import.meta.envName` for both Vite and webpack/Rspack builds ([#​34844](https://github.com/nuxt/nuxt/issues/34844)). This is the value set by `--envName` (or the resolved default), so you can branch on it in your app code:
```ts
if (import.meta.envName === 'staging') {
// enable staging-only behaviour
}
```
📖 [`import.meta` documentation](https://nuxt.com/docs/api/advanced/import-meta)
##### 🔭 Tracing Channels for SSR Events
Nuxt now publishes [diagnostics-channel](https://nodejs.org/api/diagnostics_channel.html) traces for its server-side subsystems ([#​35191](https://github.com/nuxt/nuxt/issues/35191)). It's unopinionated: we emit `nuxt.render`, `nuxt.island`, `nuxt.data`, and `nuxt.plugin` channels following the [untracing](https://github.com/unjs/untracing) naming convention, and you can build OpenTelemetry (or anything else) on top. It works in Node, Deno, Bun, and Cloudflare Workers.
```ts
// nuxt.config.ts
export default defineNuxtConfig({
// Turn on Nuxt's own channels
tracingChannel: true,
})
```
You can also enable it granularly. In Nuxt v5, there will be additional Nitro-level channels:
```ts
// nuxt.config.ts
export default defineNuxtConfig({
tracingChannel: {
nuxt: true,
},
})
```
> \[!NOTE]
> Channel names, payload shapes, and option keys may still change while the [untracing](https://github.com/unjs/untracing) registry settles.
##### 📦 Dependency Upgrades
##### `unhead` v3
Nuxt's head management now runs on [`unhead` v3](https://unhead.unjs.io/docs/releases/v3) ([#​34793](https://github.com/nuxt/nuxt/issues/34793)). It's smaller, uses a synchronous engine internally, and ships better type-safety for `useHead` out of the box. This also unblocks SSR streaming.
> \[!WARNING]
> `unhead` v3 introduces type-narrowing for `useHead`, which can be a **breaking type change** if you were relying on the looser v2 types. The runtime behaviour is compatible for the vast majority of apps, and promise input (deprecated in v2) is no longer supported. If you hit type errors after upgrading, they're almost always genuine tightening rather than regressions.
##### `unctx` v3
We've moved to [`unctx` v3](https://github.com/unjs/unctx) ([#​35541](https://github.com/nuxt/nuxt/issues/35541)), which resolves a class of long-standing async context issues ([#​33644](https://github.com/nuxt/nuxt/issues/33644)). This is part of the composable-context reliability work that continues into v5.
##### And more
We've also updated `magic-string` to v1, Babel to v8, and pulled in the latest Rolldown across the board. Running `nuxt upgrade --dedupe` (see below) is the easiest way to pull these through cleanly.
##### 🛠️ Nuxt CLI
This release bundles some improvements from `@nuxt/cli` v3.36 and v3.37:
- **`nuxt module remove`** to uninstall a module and clean up its config ([nuxt/cli#1306](https://github.com/nuxt/cli/pull/1306)), the natural companion to `nuxt module add`.
- **Non-interactive `nuxt init`** for scripting and CI ([nuxt/cli#1341](https://github.com/nuxt/cli/pull/1341)), plus it now respects the template's own package manager instead of prompting ([nuxt/cli#1330](https://github.com/nuxt/cli/pull/1330)).
- **Type-check onboarding**: `nuxt typecheck` now offers to install `vue-tsc` and `typescript` for you if they're missing ([nuxt/cli#1316](https://github.com/nuxt/cli/pull/1316)).
- **Golar support for type-checking**: `nuxt typecheck` can now use [Golar](https://golar.dev) as an alternative to `vue-tsc` ([nuxt/cli#1362](https://github.com/nuxt/cli/pull/1362)). It's picked up automatically if it's installed (or a `golar.config.*` file exists), and you can force a checker with `--checker=vue-tsc` or `--checker=golar`:
```sh
nuxt typecheck --checker=golar
```
- **Layer-aware dev server**: the dev server now reloads on changes to local layer `nuxt.config` files ([nuxt/cli#1345](https://github.com/nuxt/cli/pull/1345)).
##### 🧩 TypeScript Plugin and Named Layout Slots
Nuxt's experimental TypeScript plugin is powered by [`@dxup/nuxt`](https://github.com/KazariEX/dxup), and this release bundles a newer version of it. If you haven't tried it, turning on `experimental.typescriptPlugin` gives you a set of editor niceties: renaming an auto-imported component updates every usage, plus go-to-definition for glob imports, Nitro routes, `definePageMeta`, `runtimeConfig`, and typed route names.
New in the bundled version is an opt-in **runtime** feature: named layout slots ([KazariEX/dxup#20](https://github.com/KazariEX/dxup/pull/20)). You can write a top-level named-slot template in a page and have it forwarded into the matching named slot of the active layout. That lets a page inject content into its layout's slots, which file-based layouts don't otherwise allow.
Enable it alongside the plugin:
```ts
// nuxt.config.ts
export default defineNuxtConfig({
experimental: {
typescriptPlugin: true,
},
dxup: {
features: {
namedLayoutSlots: true,
},
},
})
```
Then a layout can expose named slots:
```vue
<!-- layouts/center.vue -->
<template>
<slot />
<slot name="side" one="one" />
</template>
```
And any page using that layout can fill them:
```vue
<!-- pages/about.vue -->
<script setup lang="ts">
definePageMeta({ layout: 'center' })
</script>
<template>
<template #side="{ one }">
This "{{ one }}" comes from the layout slot.
</template>
<div>About page</div>
</template>
```
📖 [`typescriptPlugin` documentation](https://nuxt.com/docs/guide/going-further/experimental-features#typescriptplugin)
##### 🔥 Performance and Reliability
As always, a lot of work has gone into making Nuxt faster and steadier.
One you can opt into today is the **shared file watcher** ([#​35143](https://github.com/nuxt/nuxt/issues/35143)). Vite already runs a chokidar-based watcher, so Nuxt can piggy-back on it instead of spinning up a second one, using less memory and fewer file handles. This becomes the default with `compatibilityVersion: 5`, but you can turn it on now and let us know how it goes:
```ts
// nuxt.config.ts
export default defineNuxtConfig({
experimental: {
watcher: 'builder',
},
})
```
There are also some other good performance improvements that don't need to be opted into:
- **Faster dev startup**: dev-only Nitro and pages work is now deferred and streamlined ([#​35381](https://github.com/nuxt/nuxt/issues/35381), [#​35383](https://github.com/nuxt/nuxt/issues/35383)).
- **Leaner production builds**: the island-renderer chunk is skipped entirely when you use no islands ([#​35456](https://github.com/nuxt/nuxt/issues/35456)), and plugin handling is tree-shaken out of prod builds ([#​35278](https://github.com/nuxt/nuxt/issues/35278)).
- **Improved island hashing**: more stable island and key hashing, with `getIslandHash` and `hashKey` now exposed ([#​35583](https://github.com/nuxt/nuxt/issues/35583)).
- **Concurrency and I/O wins** across Kit path resolution and Nitro inline styles ([#​35511](https://github.com/nuxt/nuxt/issues/35511), [#​35514](https://github.com/nuxt/nuxt/issues/35514)).
A couple of other nice quality-of-life fixes:
- `$fetch` is now auto-imported in user code, which fixes edge cases with top-level `$fetch.create` under Rolldown's output format ([#​35581](https://github.com/nuxt/nuxt/issues/35581)).
- Nuxt now honours system `HTTP_PROXY` / `HTTPS_PROXY` environment variables in the builder environment ([#​35183](https://github.com/nuxt/nuxt/issues/35183)).
- HMR now works for `defineNuxtComponent` in JSX ([#​35620](https://github.com/nuxt/nuxt/issues/35620)).
##### ⚠️ Heads-Up Before Upgrading
As mentioned above, this release includes three major dependency bumps. For most apps they're transparent, but they're worth a moment of attention:
- **Vite 8**: check custom Vite plugins and config against the [Vite migration guide](https://vite.dev/guide/migration).
- **Rspack 2**: if you use `builder: 'rspack'`, the internals are now Rsbuild-based, so custom Rspack config may need review.
- **`unhead` v3**: possible breaking *type* changes from stricter `useHead` typing.
##### ⬆️ Upgrading
Our recommendation for upgrading is to run:
```sh
npx nuxt upgrade --dedupe
# or, if you are staying on the 3.x line
npx nuxt@latest upgrade --dedupe --channel=v3
```
This will deduplicate your lockfile and help ensure you pull in updates from the other dependencies Nuxt relies on, particularly across the unjs ecosystem (which matters more than usual this release, given the major bumps).
> \[!TIP]
> Check out our [upgrade guide](https://nuxt.com/docs/getting-started/upgrade) if you're upgrading from an older version.
Thank you to all of the many contributors to this release. This was a big one, and it wouldn't happen without you. 💚
#### 👉 Changelog
[compare changes](https://github.com/nuxt/nuxt/compare/v4.4.8...v4.5.0)
##### 🚀 Enhancements
- **rspack:** Upgrade to rspack v2 ([#​34929](https://github.com/nuxt/nuxt/pull/34929))
- **nuxt:** Migrate to unhead v3 ([#​34793](https://github.com/nuxt/nuxt/pull/34793))
- **nuxt:** Support named views via filename convention ([#​35123](https://github.com/nuxt/nuxt/pull/35123))
- **nuxt:** Expose environment name on `import.meta` ([#​34844](https://github.com/nuxt/nuxt/pull/34844))
- **nuxt:** Forward destination preload hints on link prefetch ([#​35144](https://github.com/nuxt/nuxt/pull/35144))
- **nuxt:** Honour http proxy env vars in builder environment ([#​35183](https://github.com/nuxt/nuxt/pull/35183))
- **kit:** Support `allowImportingTsExtensions` ([87c214b34](https://github.com/nuxt/nuxt/commit/87c214b34))
- **nitro,nuxt,schema:** Add experimental SSR streaming ([5f4efe5a5](https://github.com/nuxt/nuxt/commit/5f4efe5a5))
- **vite:** Migrate to Vite 8 ([#​34256](https://github.com/nuxt/nuxt/pull/34256))
- **nitro,nuxt:** Add support for tracing channels for ssr events ([#​35191](https://github.com/nuxt/nuxt/pull/35191))
- **kit,nitro,nuxt,schema,vite,webpack:** `nuxt/*` build output contract ([#​35463](https://github.com/nuxt/nuxt/pull/35463))
- **nuxt:** Expose `NuxtLink` prefetch props for custom slot ([#​34539](https://github.com/nuxt/nuxt/pull/34539))
- **rspack:** Use rspack-specific Vue loader ([a085e8e34](https://github.com/nuxt/nuxt/commit/a085e8e34))
- **rspack:** Use rspack-specific Vue loader ([#​35566](https://github.com/nuxt/nuxt/pull/35566))
- **nuxt,vite:** Attach vite HMR to the shared dev server listener ([a8ea0c7e2](https://github.com/nuxt/nuxt/commit/a8ea0c7e2))
- **nuxt:** Add `enabled` option to AsyncData ([#​33260](https://github.com/nuxt/nuxt/pull/33260))
- **rspack:** Use rsbuild dev server in middleware mode ([#​35575](https://github.com/nuxt/nuxt/pull/35575))
- **nuxt:** Expose `getIslandHash` + `hashKey` + improve hash for keys ([#​35583](https://github.com/nuxt/nuxt/pull/35583))
- **nuxt:** Add `useLayout` composable for accessing the resolved route layout ([#​35623](https://github.com/nuxt/nuxt/pull/35623))
- **nuxt:** Support `enabled` option in `useFetch` ([#​35627](https://github.com/nuxt/nuxt/pull/35627))
- Error code system ([#​35429](https://github.com/nuxt/nuxt/pull/35429))
- **nuxt:** Require keyed function 'source' with compatibilityVersion 5 ([d56662647](https://github.com/nuxt/nuxt/commit/d56662647))
- **kit:** Order layer aliases before generic root aliases (`~`, `@`) ([#​35641](https://github.com/nuxt/nuxt/pull/35641))
- **kit:** Add `updateAppConfig` util for module authors ([#​35651](https://github.com/nuxt/nuxt/pull/35651))
- **nuxt:** Warn when parent page lacks NuxtPage ([#​35639](https://github.com/nuxt/nuxt/pull/35639))
##### 🔥 Performance
- **nuxt,vite:** Reuse vite watcher via `experimental.watcher` ([#​35143](https://github.com/nuxt/nuxt/pull/35143))
- **nuxt:** Tree-shake unneeded plugin handling from prod builds ([#​35278](https://github.com/nuxt/nuxt/pull/35278))
- **nuxt:** Defer dev-only nitro startup work ([#​35381](https://github.com/nuxt/nuxt/pull/35381))
- **nuxt:** Reduce dev pages startup work ([#​35383](https://github.com/nuxt/nuxt/pull/35383))
- **vite:** Skip unnecessary decorator transforms ([#​35395](https://github.com/nuxt/nuxt/pull/35395))
- **nuxt,rspack,vite,webpack:** Migrate to `rolldown-string` ([#​35058](https://github.com/nuxt/nuxt/pull/35058))
- **nitro,nuxt,vite:** Remove unused dependencies ([#​34861](https://github.com/nuxt/nuxt/pull/34861))
- **nuxt:** Re-parse transformed file once in tree-shake plugin ([#​35509](https://github.com/nuxt/nuxt/pull/35509))
- **nuxt:** Index scanned components by name to avoid quadratic lookup ([#​35510](https://github.com/nuxt/nuxt/pull/35510))
- **kit:** Stat paths directly and probe extensions in parallel ([#​35511](https://github.com/nuxt/nuxt/pull/35511))
- **nitro:** Load inline style chunks concurrently ([#​35514](https://github.com/nuxt/nuxt/pull/35514))
- **nuxt:** Skip island-renderer chunk when no islands used ([#​35456](https://github.com/nuxt/nuxt/pull/35456))
##### 🩹 Fixes
- **nuxt:** Fix explicit return types of factory types ([40a80ec7d](https://github.com/nuxt/nuxt/commit/40a80ec7d))
- **vite:** Do not await `ready` event for vite watcher ([6fe539f52](https://github.com/nuxt/nuxt/commit/6fe539f52))
- **vite:** Invalidate modules for legacy vite server ([#​35315](https://github.com/nuxt/nuxt/pull/35315))
- **kit,nuxt:** Pass error as `cause` when we re-throw ([#​35387](https://github.com/nuxt/nuxt/pull/35387))
- **nuxt:** Make virtual module IDs stable across hosts ([#​35317](https://github.com/nuxt/nuxt/pull/35317))
- **vite:** Inline CSS for lazy components imported from `#components` ([#​35215](https://github.com/nuxt/nuxt/pull/35215))
- **nuxt:** Validate `<ClientOnly>` fallback tag name ([#​35325](https://github.com/nuxt/nuxt/pull/35325))
- **vite:** Extract server page CSS when `inlineStyles` is disabled ([#​35209](https://github.com/nuxt/nuxt/pull/35209))
- **nitro:** Include nested layers in nitro transforms ([#​35327](https://github.com/nuxt/nuxt/pull/35327))
- **kit:** Don't exclude layer module runtime files from app tsconfig ([#​35326](https://github.com/nuxt/nuxt/pull/35326))
- **nitro:** Export empty styles object with `ssr: false` ([#​35330](https://github.com/nuxt/nuxt/pull/35330))
- **nuxt:** Emit auto-import paths as files, not directories ([#​35333](https://github.com/nuxt/nuxt/pull/35333))
- **nuxt:** Suppress spurious slot warning in `NuxtPage` during nav ([#​35335](https://github.com/nuxt/nuxt/pull/35335))
- **vite:** Preserve backslash separators in windows named pipe path ([#​35336](https://github.com/nuxt/nuxt/pull/35336))
- **nuxt:** Detach in-flight promise on `useAsyncData` teardown ([#​35328](https://github.com/nuxt/nuxt/pull/35328))
- **nuxt:** Respect per-page keepalive set via `definePageMeta` ([#​34526](https://github.com/nuxt/nuxt/pull/34526))
- **nuxt:** Align useFetch error type with runtime ([#​35346](https://github.com/nuxt/nuxt/pull/35346))
- **nuxt:** Unwrap getter `body` in `useFetch` ([#​35343](https://github.com/nuxt/nuxt/pull/35343))
- **rspack,webpack:** Strip invalid webpack PURE annotations ([#​35386](https://github.com/nuxt/nuxt/pull/35386))
- **nuxt:** Guard against -1 when unregistering a router hook ([#​35391](https://github.com/nuxt/nuxt/pull/35391))
- **nuxt:** Clean up load/error listeners in preloadPayload ([#​35392](https://github.com/nuxt/nuxt/pull/35392))
- **nuxt:** Avoid idle wait when refreshing data after hydration ([#​35358](https://github.com/nuxt/nuxt/pull/35358))
- **nuxt:** Hash serialized island props ([#​35356](https://github.com/nuxt/nuxt/pull/35356))
- **nuxt:** Ensure `page:start` finishes before `page:finish` starts ([#​35408](https://github.com/nuxt/nuxt/pull/35408))
- **vite:** Invalidate lazily-created SSR modules on render ([#​35410](https://github.com/nuxt/nuxt/pull/35410))
- **nuxt:** Preserve plugin navigation during app boot ([#​35344](https://github.com/nuxt/nuxt/pull/35344))
- **vite:** Invalidate stale SSR virtual modules on render ([#​35413](https://github.com/nuxt/nuxt/pull/35413))
- **nitro:** Don't preload JS for lazy-hydrated components ([#​35342](https://github.com/nuxt/nuxt/pull/35342))
- **vite:** Add extension to vite-node-runner virtual specifier ([0bf3f1d5d](https://github.com/nuxt/nuxt/commit/0bf3f1d5d))
- **vite:** Invalidate ssr copy of regenerated templates ([33a581ce7](https://github.com/nuxt/nuxt/commit/33a581ce7))
- **vite:** Set define for `NODE_ENV` and `__VUE_PROD_DEVTOOLS__` ([#​35444](https://github.com/nuxt/nuxt/pull/35444))
- **vite:** Avoid emitted ssr styles file name collisions ([#​35432](https://github.com/nuxt/nuxt/pull/35432))
- **nuxt:** Avoid syncing route too early when reused page remounts ([#​35440](https://github.com/nuxt/nuxt/pull/35440))
- **nuxt:** Skip showing route errors for crawlers ([#​35411](https://github.com/nuxt/nuxt/pull/35411))
- **nuxt:** Keep nested layout on deferred route during suspended layout switch ([#​35443](https://github.com/nuxt/nuxt/pull/35443))
- **nuxt:** Restore deferred query route before page is mounted ([#​35442](https://github.com/nuxt/nuxt/pull/35442))
- **kit,nuxt:** Resolve auto-import type paths through shared resolver ([#​35451](https://github.com/nuxt/nuxt/pull/35451))
- **nuxt:** Make islands hash backwards-compatible ([#​35452](https://github.com/nuxt/nuxt/pull/35452))
- **vite:** Give ssr its own hmr websocket port on vite 8.1 ([#​35458](https://github.com/nuxt/nuxt/pull/35458))
- **nuxt:** Auto-import `$fetch` where possible ([#​35581](https://github.com/nuxt/nuxt/pull/35581))
- **nuxt:** Update unctx to v3 ([#​35541](https://github.com/nuxt/nuxt/pull/35541))
- **nitro:** Point cache driver at `.mjs` runtime output ([#​35263](https://github.com/nuxt/nuxt/pull/35263))
- **nuxt:** Add `head.push` for client side ([#​35498](https://github.com/nuxt/nuxt/pull/35498))
- **nitro:** Only reload nitro after initial nitro build ([30a573733](https://github.com/nuxt/nuxt/commit/30a573733))
- **nuxt:** Pass nuxt `rootDir` to typed-router context ([#​35565](https://github.com/nuxt/nuxt/pull/35565))
- **nuxt:** Type `__nuxt_error` marker on `NuxtError` ([06e976d2e](https://github.com/nuxt/nuxt/commit/06e976d2e))
- **kit:** `noUncheckedSideEffectImports` (v5) + disable `libReplacement` ([#​35548](https://github.com/nuxt/nuxt/pull/35548))
- **nuxt:** Node10 compatible subpath exports ([a216d732d](https://github.com/nuxt/nuxt/commit/a216d732d))
- **nuxt:** Unwrap module mutation trackers from options after installing ([#​35574](https://github.com/nuxt/nuxt/pull/35574))
- **nuxt:** Entity-encode redirect body to preserve query separators ([#​35486](https://github.com/nuxt/nuxt/pull/35486))
- **rspack,webpack:** Use async entry in dev to avoid circular import ([#​35586](https://github.com/nuxt/nuxt/pull/35586))
- **nuxt:** Tolerate missing dirs in parcel watcher ([#​35585](https://github.com/nuxt/nuxt/pull/35585))
- **nuxt:** Respect saved scroll position on same-page back navigation from hash ([#​35608](https://github.com/nuxt/nuxt/pull/35608))
- **nuxt:** Resolve unctx helper to an absolute path for server bundling ([#​35602](https://github.com/nuxt/nuxt/pull/35602))
- **nuxt:** Apply `unctx` transform marker through `magic-string` ([#​35618](https://github.com/nuxt/nuxt/pull/35618))
- **schema:** Enable HMR for defineNuxtComponent in JSX ([#​35620](https://github.com/nuxt/nuxt/pull/35620))
- **nuxt:** Evict stale forwarded prefetch hints and fix key mismatch ([#​35621](https://github.com/nuxt/nuxt/pull/35621))
- **nuxt:** Re-add computeIslandHash for backwards compatibility ([353164bb5](https://github.com/nuxt/nuxt/commit/353164bb5))
- **nitro:** Correct nitro runtime config type key ([bc3b53add](https://github.com/nuxt/nuxt/commit/bc3b53add))
- **schema:** Resolve Vite cache directory from workspace ([#​35626](https://github.com/nuxt/nuxt/pull/35626))
- **nitro:** Externalise dev SSR entry to avoid slow rollup re-parse ([ff42c54a7](https://github.com/nuxt/nuxt/commit/ff42c54a7))
- **nuxt:** Drop extension on diagnostics import ([c699cc0de](https://github.com/nuxt/nuxt/commit/c699cc0de))
- **nitro:** Write prerender cache files atomically ([#​35619](https://github.com/nuxt/nuxt/pull/35619))
- **nitro:** Don't import `node:process` in diagnostics ([d73b5df6d](https://github.com/nuxt/nuxt/commit/d73b5df6d))
- **nuxt:** Apply latest navigation on concurrent `navigateTo` in built-in router ([#​35631](https://github.com/nuxt/nuxt/pull/35631))
- **nuxt:** Update client URL to match SSR on fatal middleware error ([#​35637](https://github.com/nuxt/nuxt/pull/35637))
##### 💅 Refactors
- **nitro,nuxt:** Add explicit return types to runtime files ([#​35139](https://github.com/nuxt/nuxt/pull/35139))
- **nuxt:** Resolve builder earlier + skip watcher for `nuxt prepare` ([#​35141](https://github.com/nuxt/nuxt/pull/35141))
- **nuxt:** Delete cleared keys in `clearNuxtData` & `clearNuxtState` ([#​35142](https://github.com/nuxt/nuxt/pull/35142))
- **nuxt:** Use jiti `fsCache` instead of deprecated `cache` ([#​35268](https://github.com/nuxt/nuxt/pull/35268))
- **nitro:** Use walkResolver instead of deprecated resolveUnrefHeadInput ([#​35267](https://github.com/nuxt/nuxt/pull/35267))
- **nuxt:** Add type predicates ([#​35208](https://github.com/nuxt/nuxt/pull/35208))
- **vite:** Type vite-node-runner error data and resolve `#vite-node` types from source ([#​35334](https://github.com/nuxt/nuxt/pull/35334))
- **nuxt:** Split head runtime plugin by environment ([#​35389](https://github.com/nuxt/nuxt/pull/35389))
- **nuxt:** Use `rolldown/utils` instead of oxc-\* dependencies ([#​34983](https://github.com/nuxt/nuxt/pull/34983))
- **kit,vite,webpack,nitro,schema:** `ssrStyles` build output => lazy code provider ([#​35601](https://github.com/nuxt/nuxt/pull/35601))
- **nuxt,nitro:** Use dev exports for no-build type-checking ([#​35605](https://github.com/nuxt/nuxt/pull/35605))
- **rspack:** Use `rsbuild` to power rspack builder ([#​35489](https://github.com/nuxt/nuxt/pull/35489))
- **vite:** Extract TemplateHMRPlugin from DevServerPlugin ([#​35579](https://github.com/nuxt/nuxt/pull/35579))
##### 📖 Documentation
- Add builder guide ([#​35576](https://github.com/nuxt/nuxt/pull/35576))
- Correct and improve `useAsyncData` and `useFetch` ([#​35528](https://github.com/nuxt/nuxt/pull/35528))
- Improving testing documentation for better understanding ([#​35526](https://github.com/nuxt/nuxt/pull/35526))
- Fix incorrect transform signature in useAsyncData/useFetch type docs ([#​35403](https://github.com/nuxt/nuxt/pull/35403))
- Add minimal version badges to API documentation ([#​34485](https://github.com/nuxt/nuxt/pull/34485))
- Clarify usage of await with useFetch ([#​33745](https://github.com/nuxt/nuxt/pull/33745))
- Add badges for new features ([1839fe01d](https://github.com/nuxt/nuxt/commit/1839fe01d))
- Remove `enabled` from `useFetch` docs ([bf7810600](https://github.com/nuxt/nuxt/commit/bf7810600))
- Add tip about prerendering registration for pages ([#​35635](https://github.com/nuxt/nuxt/pull/35635))
- Clarify that `useFetch` keys are unique per call site ([#​35645](https://github.com/nuxt/nuxt/pull/35645))
- Clarify useFetch custom data error ([#​35647](https://github.com/nuxt/nuxt/pull/35647))
##### 📦 Build
- Use `tsdown` to build project ([#​35179](https://github.com/nuxt/nuxt/pull/35179))
##### 🏡 Chore
- Update lockfile ([92087005f](https://github.com/nuxt/nuxt/commit/92087005f))
- Handle cleaning nuxt build dist manually ([aaafe9879](https://github.com/nuxt/nuxt/commit/aaafe9879))
- Upgrade oxc/tsdown/rolldown deps together ([28173926d](https://github.com/nuxt/nuxt/commit/28173926d))
- Use `vp` in nightly release script ([97b56d98d](https://github.com/nuxt/nuxt/commit/97b56d98d))
- Update lockfile for tsdown build and dev exports ([5d9cd2d67](https://github.com/nuxt/nuxt/commit/5d9cd2d67))
- Update bundle size snapshots ([b9d353516](https://github.com/nuxt/nuxt/commit/b9d353516))
- Allow node version updates ([#​35297](https://github.com/nuxt/nuxt/pull/35297))
- Update bundle size ([d37b13b60](https://github.com/nuxt/nuxt/commit/d37b13b60))
##### ✅ Tests
- Strip host path from server bundle before measuring size ([#​35316](https://github.com/nuxt/nuxt/pull/35316))
- Run playwright tests in dev mode too ([#​35329](https://github.com/nuxt/nuxt/pull/35329))
- **nuxt:** Benchmark dev `loadNuxt` startup ([#​35382](https://github.com/nuxt/nuxt/pull/35382))
- Update bundle size snapshot ([64a834281](https://github.com/nuxt/nuxt/commit/64a834281))
- Use h3 v1 syntax in test ([1ea2eec07](https://github.com/nuxt/nuxt/commit/1ea2eec07))
- Use `experimental.attachDebugInfo` ([7c2397ae6](https://github.com/nuxt/nuxt/commit/7c2397ae6))
- Update assertions ([55f7ea025](https://github.com/nuxt/nuxt/commit/55f7ea025))
- Pack with pnpm before running attw to honour publishConfig ([e2f0dd69d](https://github.com/nuxt/nuxt/commit/e2f0dd69d))
- Reduce flakiness on hydration tests ([#​35457](https://github.com/nuxt/nuxt/pull/35457))
- Improve test stability on macos ([#​35462](https://github.com/nuxt/nuxt/pull/35462))
- Force disable `test` mode for bundle size tests ([#​35558](https://github.com/nuxt/nuxt/pull/35558))
- Pin typescript in basic-types fixture to dedupe vue ([a3b824918](https://github.com/nuxt/nuxt/commit/a3b824918))
- **webpack:** Cover Vue loader scope hashes ([824daffa0](https://github.com/nuxt/nuxt/commit/824daffa0))
- **builders:** Clean up Vue loader fixtures ([ca18affc3](https://github.com/nuxt/nuxt/commit/ca18affc3))
- Reenable webpack/rspack dev tests ([#​35571](https://github.com/nuxt/nuxt/pull/35571))
- Await `expectNoClientErrors` ([9f3123f60](https://github.com/nuxt/nuxt/commit/9f3123f60))
- Mark tests as succeeding for rspack/webpack ([513ad306e](https://github.com/nuxt/nuxt/commit/513ad306e))
- Add support for non-ascii filenames in public assets ([#​35636](https://github.com/nuxt/nuxt/pull/35636))
- Minify server bundles in bundle size snapshot ([#​35638](https://github.com/nuxt/nuxt/pull/35638))
- Run matrix-independent suites once across the fixture matrix ([#​35646](https://github.com/nuxt/nuxt/pull/35646))
- Mark webpack/rspack tests as passing on 4.x ([3ae095b29](https://github.com/nuxt/nuxt/commit/3ae095b29))
##### 🤖 CI
- Reenable bundle size tests 😱 ([#​35279](https://github.com/nuxt/nuxt/pull/35279))
- Only run workflow in nuxt org ([#​35377](https://github.com/nuxt/nuxt/pull/35377))
- Skip entire job, not just step ([#​35378](https://github.com/nuxt/nuxt/pull/35378))
- Error handling for webhook triggers ([#​35379](https://github.com/nuxt/nuxt/pull/35379))
- Update agentscan ([#​35397](https://github.com/nuxt/nuxt/pull/35397))
- Only run benchmark tests in Nuxt org ([#​35414](https://github.com/nuxt/nuxt/pull/35414))
- Don't auto-close team prs 🫣 ([cd965f569](https://github.com/nuxt/nuxt/commit/cd965f569))
- Use vite-plus to manage pnpm ([#​35570](https://github.com/nuxt/nuxt/pull/35570))
- Use parallel keyword for concurrent workflow steps ([#​35448](https://github.com/nuxt/nuxt/pull/35448))
- Handle missing base branch (for stacked prs) ([8d3daa34e](https://github.com/nuxt/nuxt/commit/8d3daa34e))
- Unlink issues from autoclosed PRs ([#​35615](https://github.com/nuxt/nuxt/pull/35615))
##### ❤️ Contributors
- Jordan Labrosse ([@​Jorgagu](https://github.com/Jorgagu))
- Luke Nelson ([@​luc122c](https://github.com/luc122c))
- Florian Heuberger ([@​Flo0806](https://github.com/Flo0806))
- Daniel Roe ([@​danielroe](https://github.com/danielroe))
- Yannik Schröder ([@​yschroe](https://github.com/yschroe))
- Mateleo ([@​Mateleo](https://github.com/Mateleo))
- Matej Černý ([@​cernymatej](https://github.com/cernymatej))
- Eduardo San Martin Morote ([@​posva](https://github.com/posva))
- Darlan José Batista do Prado ([@​DarlanPrado](https://github.com/DarlanPrado))
- Ulrich-Matthias Schäfer ([@​Fuzzyma](https://github.com/Fuzzyma))
- Bochkarev Ivan ([@​Ibochkarev](https://github.com/Ibochkarev))
- Julien Huang ([@​huang-julien](https://github.com/huang-julien))
- Damian Głowala ([@​DamianGlowala](https://github.com/DamianGlowala))
- KazariAI ([@​KazariAI](https://github.com/KazariAI))
- Fahad Khan ([@​oniChan1226](https://github.com/oniChan1226))
- skoenfaelt ([@​skoenfaelt](https://github.com/skoenfaelt))
- Cynthia Rey ([@​cyyynthia](https://github.com/cyyynthia))
- meomking ([@​CaptainWang98](https://github.com/CaptainWang98))
- antlis ([@​antlis](https://github.com/antlis))
- Néstor ([@​Nsttt](https://github.com/Nsttt))
- Issayah ([@​VividLemon](https://github.com/VividLemon))
- Alexander Lichter ([@​TheAlexLichter](https://github.com/TheAlexLichter))
- Anoesj Sadraee ([@​Anoesj](https://github.com/Anoesj))
- Quentin Macq ([@​quentinmcq](https://github.com/quentinmcq))
- raminjafary ([@​raminjafary](https://github.com/raminjafary))
- Kurt Medley ([@​HeavyMedl](https://github.com/HeavyMedl))
- isksss ([@​isksss](https://github.com/isksss))
- Matteo Gabriele ([@​MatteoGabriele](https://github.com/MatteoGabriele))
- Max ([@​onmax](https://github.com/onmax))
- Harlan Wilton ([@​harlan-zw](https://github.com/harlan-zw))
</details>
---
### Configuration
📅 **Schedule**: (UTC)
- Branch creation
- At any time (no schedule defined)
- Automerge
- At any time (no schedule defined)
🚦 **Automerge**: Enabled.
♻ **Rebasing**: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.
🔕 **Ignore**: Close this PR and you won't be reminded about this update again.
---
- [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box
---
This PR has been generated by [Mend Renovate](https://github.com/renovatebot/renovate).
<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0My4yNTcuMiIsInVwZGF0ZWRJblZlciI6IjQzLjI1Ny4yIiwidGFyZ2V0QnJhbmNoIjoibWFpbiIsImxhYmVscyI6W119-->
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
This PR contains the following updates:
4.4.8→4.5.0Release Notes
nuxt/nuxt (nuxt)
v4.5.0Compare Source
📣 Some News
Preparing for Nuxt 5
A good chunk of this release is (hopefully) invisible plumbing for Nuxt 5. We've moved onto the latest major versions of several core dependencies (
unheadv3,unctxv3, and Vite 8), switched the framework's own build over totsdown, and introduced a stablenuxt/*build output contract with dev exports so that type-checking in the Nuxt monorepo works without a build step (#35463, #35605).Much of this is working to shrink the gap between v4 and v5 internally, so that the migration will be as boring as possible.
With the release of Nuxt v4.5, our focus as a team will turn to stabilising Nuxt v5 and creating compatibility utilities to make the upgrade as smooth as possible.
Nuxt 3 End-of-Life
Nuxt 3 reaches end-of-life on July 31, 2026, so this is one of the last few 3.x releases we'll ship. If you're still on v3, now is a great time to move across. Most people told us the v3 to v4 upgrade was smooth, and we've kept the upgrade guide up to date.
Alongside v4.5.0 we're publishing a maintenance patch for the 3.x line (v3.21.9) with the compatible bug fixes and smaller improvements from this release backported. The headline items here (Vite 8, Rspack 2,
unheadv3,unctxv3) are major upgrades and stay v4-only, so 3.x remains stable as it approaches end-of-life.👀 Highlights
Nuxt 4.5 is a big one. This release ships three major upgrades to the build layer (Vite 8, Rspack 2, and a brand new Rsbuild-powered pipeline for the Rspack builder), an experimental SSR streaming mode, a handful of new composables and conventions, and a lot of groundwork that brings us closer to Nuxt 5.
There's a lot here, so grab a coffee. ☕️
⚡️ Vite 8
Nuxt now runs on Vite 8 (#34256). This brings faster cold starts, the latest Rolldown-powered internals, and many upstream improvements from the Vite team.
For most apps this is a transparent upgrade. If you have custom Vite plugins or config, it's worth skimming the Vite migration guide to check for anything that affects you.
🦀 Rspack 2 and Rsbuild
If you use the Rspack builder, this release is a substantial upgrade. We've moved to Rspack 2 (#34929), which is faster and lighter, and rebuilt the builder on top of
@rsbuild/core(#35489).The public surface stays the same. You still opt in with
builder: 'rspack'and the existingrspack:*hooks continue to work:Under the hood, though, a lot has changed for the better:
webpack-dev-middlewareandwebpack-hot-middleware(#35575).🌊 Experimental SSR Streaming
This is one I'm particularly excited about. You can now enable SSR streaming to dramatically improve Time to First Byte (#34411). Instead of buffering the whole rendered page and sending it in one go, Nuxt flushes the HTML shell (your
<head>, styles, preload hints, and entry scripts) immediately, then streams the body as Vue renders it.Streaming is automatically disabled for bots and crawlers so search engines still receive fully-rendered HTML. You can tune which user agents count as crawlers, and you can opt individual routes out:
There's one thing worth understanding before you turn it on. Because streaming commits the HTTP status and headers with the very first byte, anything that mutates the response after rendering has begun (a
setResponseStatus()in a<script setup>, a cookie write during middleware, and so on) can't reach the client. Nuxt handles the common cases for you: routes withredirect,cache,isr,swr,noScripts, orssr: falserules automatically fall back to the buffered renderer, and in development we log a warning naming any dropped mutations so nothing fails silently.📖 SSR streaming documentation
🩺 Stable Error Codes
This one I'm really happy about. Nuxt now has a stable error code system (#35429). Warnings and errors raised during build and at runtime now carry a stable code (like
NUXT_E1001orNUXT_B5001), a short explanation of why it happened, and a concrete fix to try.Every code is greppable and bookmarkable, and the ones that need more than a one-line fix link straight to a dedicated docs page. For example, the classic "a composable was called outside a Nuxt context" now surfaces as
NUXT_E1001with the why/fix inline and a docs page explaining the context rules and how to userunWithContext().To keep production output lean, the verbose why/fix text is stripped from production builds, leaving just the stable code.
This is the foundation for much better error messages across Nuxt, and we'll keep migrating existing warnings and errors onto it over the coming releases. If you've ever squinted at a cryptic Nuxt message, this is for you.
🎨
useLayoutComposableThere's a new
useLayoutcomposable for reading the layout that's been resolved for the current route (#35623). Previously there was no clean, reactive way to ask "which layout is this page using?" from within a component.It returns a read-only computed ref, so it stays in sync as you navigate or as route rules and
definePageMetachange the resolved layout.📖
useLayoutdocumentation🪟 Named Views
Nuxt now supports named views through a filename convention (#35123). If a parent page renders more than one
<NuxtPage>outlet, you can give each outlet a name and provide a sibling page file for it using thename@view.vueconvention:Navigating to
/parent/childrenderschild.vueinto the default outlet andchild@sidebar.vueinto thesidebaroutlet. This has actually been possible in Vue Router for a long time; this release wires it up to Nuxt's file-based routing.📖 Named views documentation
🚦
enabledOption foruseFetchanduseAsyncDataYou can now gate data fetching with a reactive
enabledoption (#33260). Whileenabledisfalse, every execution is blocked (the initial fetch,execute/refresh, and watch triggers), and if you flip it fromtruetofalsemid-flight, the in-flight request is cancelled without clearing your existingdata.This is perfect for dependent or conditional queries, where you don't want to fire a request until some precondition is met. It pairs naturally with a getter or a ref, so it stays reactive.
📖
useAsyncDatadocumentation🔗
NuxtLinkPrefetch Control for Custom SlotsWhen you use
<NuxtLink>with thecustomprop, Nuxt no longer attaches prefetch handlers for you, because it can't know how you've structured your markup. To make that ergonomic, the slot now exposes everything you need to wire prefetching up yourself (#34539):You get
prefetchto trigger it,prefetchedto know whether it's already happened (great for a prefetched class), andshouldPrefetchto respect the user's connection and config.📖
NuxtLinkdocumentation⚡️ Forwarded Preload Hints on Prefetch
Here's another one we'd love you to try. When you prefetch a link to a route with payload extraction, Nuxt already primes the destination's data and chunks. With the new opt-in
experimental.prefetchPreloadTags(#35144), it also forwards the destination's<link rel="preload">andmodulepreloadhints (whatever the page sets viauseHead, or via modules like@nuxt/image's<NuxtImg preload>) into the current document, downgraded torel="prefetch"so they don't compete with the resources the user is looking at right now.The practical effect is that heavy above-the-fold assets on the next page (a hero image, a critical script) start downloading while the user is still on the current one, so the navigation feels instant. It's off by default while we gather feedback, so please give it a spin and tell us how it behaves on your app.
🌐
import.meta.envNameThe resolved Nuxt environment name is now available at runtime as
import.meta.envNamefor both Vite and webpack/Rspack builds (#34844). This is the value set by--envName(or the resolved default), so you can branch on it in your app code:📖
import.metadocumentation🔭 Tracing Channels for SSR Events
Nuxt now publishes diagnostics-channel traces for its server-side subsystems (#35191). It's unopinionated: we emit
nuxt.render,nuxt.island,nuxt.data, andnuxt.pluginchannels following the untracing naming convention, and you can build OpenTelemetry (or anything else) on top. It works in Node, Deno, Bun, and Cloudflare Workers.You can also enable it granularly. In Nuxt v5, there will be additional Nitro-level channels:
📦 Dependency Upgrades
unheadv3Nuxt's head management now runs on
unheadv3 (#34793). It's smaller, uses a synchronous engine internally, and ships better type-safety foruseHeadout of the box. This also unblocks SSR streaming.unctxv3We've moved to
unctxv3 (#35541), which resolves a class of long-standing async context issues (#33644). This is part of the composable-context reliability work that continues into v5.And more
We've also updated
magic-stringto v1, Babel to v8, and pulled in the latest Rolldown across the board. Runningnuxt upgrade --dedupe(see below) is the easiest way to pull these through cleanly.🛠️ Nuxt CLI
This release bundles some improvements from
@nuxt/cliv3.36 and v3.37:nuxt module removeto uninstall a module and clean up its config (nuxt/cli#1306), the natural companion tonuxt module add.Non-interactive
nuxt initfor scripting and CI (nuxt/cli#1341), plus it now respects the template's own package manager instead of prompting (nuxt/cli#1330).Type-check onboarding:
nuxt typechecknow offers to installvue-tscandtypescriptfor you if they're missing (nuxt/cli#1316).Golar support for type-checking:
nuxt typecheckcan now use Golar as an alternative tovue-tsc(nuxt/cli#1362). It's picked up automatically if it's installed (or agolar.config.*file exists), and you can force a checker with--checker=vue-tscor--checker=golar:Layer-aware dev server: the dev server now reloads on changes to local layer
nuxt.configfiles (nuxt/cli#1345).🧩 TypeScript Plugin and Named Layout Slots
Nuxt's experimental TypeScript plugin is powered by
@dxup/nuxt, and this release bundles a newer version of it. If you haven't tried it, turning onexperimental.typescriptPlugingives you a set of editor niceties: renaming an auto-imported component updates every usage, plus go-to-definition for glob imports, Nitro routes,definePageMeta,runtimeConfig, and typed route names.New in the bundled version is an opt-in runtime feature: named layout slots (KazariEX/dxup#20). You can write a top-level named-slot template in a page and have it forwarded into the matching named slot of the active layout. That lets a page inject content into its layout's slots, which file-based layouts don't otherwise allow.
Enable it alongside the plugin:
Then a layout can expose named slots:
And any page using that layout can fill them:
📖
typescriptPlugindocumentation🔥 Performance and Reliability
As always, a lot of work has gone into making Nuxt faster and steadier.
One you can opt into today is the shared file watcher (#35143). Vite already runs a chokidar-based watcher, so Nuxt can piggy-back on it instead of spinning up a second one, using less memory and fewer file handles. This becomes the default with
compatibilityVersion: 5, but you can turn it on now and let us know how it goes:There are also some other good performance improvements that don't need to be opted into:
getIslandHashandhashKeynow exposed (#35583).A couple of other nice quality-of-life fixes:
$fetchis now auto-imported in user code, which fixes edge cases with top-level$fetch.createunder Rolldown's output format (#35581).HTTP_PROXY/HTTPS_PROXYenvironment variables in the builder environment (#35183).defineNuxtComponentin JSX (#35620).⚠️ Heads-Up Before Upgrading
As mentioned above, this release includes three major dependency bumps. For most apps they're transparent, but they're worth a moment of attention:
builder: 'rspack', the internals are now Rsbuild-based, so custom Rspack config may need review.unheadv3: possible breaking type changes from stricteruseHeadtyping.⬆️ Upgrading
Our recommendation for upgrading is to run:
This will deduplicate your lockfile and help ensure you pull in updates from the other dependencies Nuxt relies on, particularly across the unjs ecosystem (which matters more than usual this release, given the major bumps).
Thank you to all of the many contributors to this release. This was a big one, and it wouldn't happen without you. 💚
👉 Changelog
compare changes
🚀 Enhancements
import.meta(#34844)allowImportingTsExtensions(87c214b34)nuxt/*build output contract (#35463)NuxtLinkprefetch props for custom slot (#34539)enabledoption to AsyncData (#33260)getIslandHash+hashKey+ improve hash for keys (#35583)useLayoutcomposable for accessing the resolved route layout (#35623)enabledoption inuseFetch(#35627)~,@) (#35641)updateAppConfigutil for module authors (#35651)🔥 Performance
experimental.watcher(#35143)rolldown-string(#35058)🩹 Fixes
readyevent for vite watcher (6fe539f52)causewhen we re-throw (#35387)#components(#35215)<ClientOnly>fallback tag name (#35325)inlineStylesis disabled (#35209)ssr: false(#35330)NuxtPageduring nav (#35335)useAsyncDatateardown (#35328)definePageMeta(#34526)bodyinuseFetch(#35343)page:startfinishes beforepage:finishstarts (#35408)NODE_ENVand__VUE_PROD_DEVTOOLS__(#35444)$fetchwhere possible (#35581).mjsruntime output (#35263)head.pushfor client side (#35498)rootDirto typed-router context (#35565)__nuxt_errormarker onNuxtError(06e976d2e)noUncheckedSideEffectImports(v5) + disablelibReplacement(#35548)unctxtransform marker throughmagic-string(#35618)node:processin diagnostics (d73b5df6d)navigateToin built-in router (#35631)💅 Refactors
nuxt prepare(#35141)clearNuxtData&clearNuxtState(#35142)fsCacheinstead of deprecatedcache(#35268)#vite-nodetypes from source (#35334)rolldown/utilsinstead of oxc-* dependencies (#34983)ssrStylesbuild output => lazy code provider (#35601)rsbuildto power rspack builder (#35489)📖 Documentation
useAsyncDataanduseFetch(#35528)enabledfromuseFetchdocs (bf7810600)useFetchkeys are unique per call site (#35645)📦 Build
tsdownto build project (#35179)🏡 Chore
vpin nightly release script (97b56d98d)✅ Tests
loadNuxtstartup (#35382)experimental.attachDebugInfo(7c2397ae6)testmode for bundle size tests (#35558)expectNoClientErrors(9f3123f60)🤖 CI
❤️ Contributors
Configuration
📅 Schedule: (UTC)
🚦 Automerge: Enabled.
♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about this update again.
This PR has been generated by Mend Renovate.