Releases: nuxt/nuxt
v3.13.1
3.13.1 is the next regularly scheduled patch release.
👀 Highlights
Although this is a patch release, there are two features I'd love to draw your attention to.
- 🆔
useId
now uses a built-in Vue composable for stable ids between server + client! #28285 - 🔥 a new
experimental.buildCache
feature now allows for quicker app rebuilds #28726
As always, feedback is appreciated 🙏 ❤️
✅ Upgrading
As usual, our recommendation for upgrading is to run:
npx nuxi@latest upgrade --force
This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the unjs ecosystem.
👉 Changelog
🔥 Performance
- nuxt: Cache vue app build outputs (#28726)
- nuxt: Use
ServerPlaceholder
for ssr client components (#28563) - nuxt: Use reducer array + handle modified proto (#28768)
🩹 Fixes
- schema: Resolve user-provided
serverDir
relative to root (#28700) - nuxt: Handle mismatching declaration/plugin extensions (#28709)
- nuxt: Do not accept arbitrary strings for
MiddlewareKey
(#28676) - nuxt: Do not pass listeners to custom
NuxtLink
(#28738) - nuxt: Generate basic jsdoc for module config entry (#27689)
- nuxt: Augment
NuxtOptions
as well as config (#28747) - nuxt: Improve error logging in import protections (#28753)
- nuxt: Handle deleted cookies from
CookieStore
events (#28760) - nuxt: Allow updating
appConfig
with non-iterable objects (#28773) - nuxt: Improve
isNuxtError
type inference (#28814)
💅 Refactors
- nuxt: Update to vue v3.5 + native
useId
(#28285)
📖 Documentation
- Fix typo (#28724)
- Update broken/redirected links (#28739)
- Capitalize text (#28734)
- Updated line number for nuxt build-time hooks (#28746)
- Add missing
query
returned value fromuseRoute()
(#28743) - Persist package manager choice in code blocks (#28514)
- Fix postcss codeblock typo (#28801)
- Include
--frozen-lockfile
when installing dependencies (#28794)
🏡 Chore
- Use
tinyexec
internally (#28684) - Use
tinyglobby
internally (#28686) - Trim tag (#28687)
- Fix ci typo (#28721)
- Tidying workflows + add sherif workflow (#28793)
- Ignore eslint warnings about console logging (#28795)
✅ Tests
- Update bundle size (99df4c222)
❤️ Contributors
- Gianluca Di Francesco (@gianlucadifrancesco)
- Daniel Roe (@danielroe)
- Joaquín Sánchez (@userquin)
- Heb (@Hebilicious)
- Eckhardt (Kaizen) Dreyer (@Eckhardt-D)
- Gustav Odinger (@gustavwilliam)
- Julien Huang (@huang-julien)
- Ismail Sabet (@ismailsabet)
- Max (@onmax)
- Anthony Fu (@antfu)
- @beer (@iiio2)
- riskrole (@riskrole)
- Thimo Sietsma (@th1m0)
v3.13.0
👀 Highlights
I'm pretty excited about this release - we've ported some features we had planned for Nuxt v4 back to v3, as well as a raft of bug fixes and performance improvements - as usual.
Here are a few of things I'm most excited about.
🏘️ Route Groups
We now support naming directories with parentheses/brackets to organise your routes without affecting the path.
For example:
-| pages/
---| index.vue
---| (marketing)/
-----| about.vue
-----| contact.vue
This will produce /
, /about
and /contact
pages in your app. The marketing
group is ignored for purposes of your URL structure.
Read more in the original PR.
🏝️ Islands and Head Metadata
It's now possible for server component islands to manipulate the head, such as by adding SEO metadata when rendering.
Read more in #27987.
🪝 Custom Prefetch Triggers
We now support custom prefetch triggers for NuxtLink
(#27846).
For example:
<template>
<div>
<NuxtLink prefetch-on="interaction">
This will prefetch when hovered or when it gains focus
</NuxtLink>
<!-- note that you probably don't want both enabled! -->
<NuxtLink :prefetch-on="{ visibility: true, interaction: true }">
This will prefetch when hovered/focus - or when it becomes visible
</NuxtLink>
</div>
</template>
It's also possible to enable/disable these globally for your app and override them per link.
For example:
export default defineNuxtConfig({
experimental: {
defaults: {
nuxtLink: {
prefetch: true,
prefetchOn: { visibility: false, interaction: true }
}
}
}
})
🗺️ Better Server Source Maps
When running with node --enable-source-maps
, you may have noticed that the source maps for the Vue files in your server build pointed to the Vite build output (something like .nuxt/dist/server/_nuxt/index-O15BBwZ3.js
).
Now, even after your Nitro build, your server source maps will reference your original source files (#28521).
Note that one of the easiest ways of improving your build performance is to turn off source maps if you aren't using them, which you can do easily in your nuxt.config
:
export default defineNuxtConfig({
sourcemap: {
server: false,
client: true,
},
})
🎁 New Features for Module Authors
In the run-up to Nuxt v4, we're working on adding some key functionality for module authors, including a new isNuxtMajorVersion
utility where required (#27579) and better inferred typing for merged module options using the new defineNuxtModule().with()
method (#27520).
✨ Improved Dev Warnings
We no longer warn when using data fetching composables in middleware (#28604) and we warn when user components' names begin with Lazy (#27838).
🚨 Vue TypeScript Changes
For a while, in the Vue ecosystem, we've been augmenting @vue/runtime-core
to add custom properties and more to vue
. However, this inadvertently breaks the types for projects that augment vue
- which is now the officially recommended in the docs way to augment these interfaces (for example, ComponentCustomProperties, GlobalComponents and so on).
This means all libraries must update their code (or it will break the types of libraries that augment vue
instead).
We've updated our types in Nuxt along these lines but you may experience issues with the latest vue-router
when used with libraries which haven't yet done so.
Please create an issue with a reproduction - I'll happily help create a PR to resolve in the upstream library in question. Or you may be able to work around the issue by creating a declarations.d.ts
in the root of your project with the following code (credit):
import type {
ComponentCustomOptions as _ComponentCustomOptions,
ComponentCustomProperties as _ComponentCustomProperties,
} from 'vue';
declare module '@vue/runtime-core' {
interface ComponentCustomProperties extends _ComponentCustomProperties {}
interface ComponentCustomOptions extends _ComponentCustomOptions {}
}
✅ Upgrading
As usual, our recommendation for upgrading is to run:
npx nuxi@latest upgrade --force
This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the unjs ecosystem.
👉 Changelog
🚀 Enhancements
- nuxt: Await custom
routes
function inrouter.options
(#27644) - kit: Add new
isNuxtMajorVersion
compatibility util (#27579) - kit,schema: Add
.with
for better module options types (#27520) - nuxt: Warn when user components' names begin with
Lazy
(#27838) - nuxt: Allow specifying app id when creating a nuxt app (#28392)
- nuxt: Custom enable/disable hooks for
usePreviewMode
(#28371) - kit: Add
prepend
option toaddRouteMiddleware
(#28496) - nuxt: Allow organising pages within route groups (#28276)
- vite: Preserve vite sourcemaps for nitro build (#28521)
- nuxt: Allow defining triggers for prefetching links (#27846)
- nuxt: Namespace
__NUXT__
when using multi-app (#27263) - nuxt: Allow server islands to manipulate head (#27987)
🔥 Performance
- nuxt: Call cookie
decode
function only for named cookie (#28215) - nuxt: Avoid making client-only component setup async (#28334)
- nuxt: Avoid multiple calls to
getCachedData
(#28472)
🩹 Fixes
- nuxt: Don't warn for
definePageMeta
in client-only pages (#28246) - kit: Include module
dist/runtime/
in tsconfig includes (#28237) - schema: Support absolute/relative paths for
assetsDir
(59f0099f4) - schema: Do not override user
serverDir
(#28249) - schema: Use new options syntax for
vite-plugin-vue
(#28307) - schema: Export new module return types (c0ad8db93)
- kit: Add missing type import (1a60b4541)
- vite,webpack: Handle local postcss plugins (#28481)
- nuxt: Handle
scroll-padding-top: auto
in scrollBehavior (#28320) - nuxt: Ensure
runtimeConfig.public
is reactive on client (#28443) - nuxt: Update renamed stub composables from
nuxt/scripts
(#28449) - nuxt: Augment
@vue/runtime-core
and@vue/runtime-dom
(#28446) - nuxt: Scan jsx pages for page metadata (#28479)
- nuxt: Handle plugin type extensions more correctly (#28480)
- vite: Respect
baseURL
for public assets in dev (#28482) - vite: Add transformation result to log for parse errors (#28508)
- vite: Include module symbols in generated code (#28509)
- nuxt: Add reason when aborting request in
useFetch
(#28517) - nuxt: Only augment
vue
, not sub-packages (#28542) - nuxt: Avoid stripping js extensions in plugin injections (#28593)
- nuxt: Preserve route-specific metadata on
route.meta
(#28441) - nuxt: Don't warn when data fetching in middleware (#28604)
- nuxt: Extract route rules/page meta in 2+ script blocks (#28625)
- nuxt: Allow customising status code in
validate
method (#28612) - nuxt: Do not provide default
prefetchOn
prop (#28630) - nuxt: Revert back to object syntax for island head (#28656)
📖 Documentation
- Fix issue in cookie passing example (#28223)
- Fix note in layers usage chapter ([#28236](https://github.com/nuxt/...
v3.12.4
3.12.4 is the next regularly scheduled patch release.
👉 Changelog
🔥 Performance
- vite: Start warmups after nitro build (#27963)
- vite: Avoid extra resolve call for
resolveId
in layers (#27971) - kit,nuxt,schema,vite,webpack: Use explicit exports (#27998)
🩹 Fixes
- schema: Resolve public alias correctly (#27975)
- nuxt: Omit rendering payload prefetch when
noScripts
(#27972) - nuxt: Add
/
as fallback if page can't be identified (e6109b226) - ui-templates: Validate templates with
html-validate
(#28024) - schema: Don't constrain postcss plugin options (#28045)
- kit: Remove exports from v4 branch (5c8312e9b)
- nuxt: Use
unhead
key for ad-hoc module options (#28088) - nuxt: Use native vue-router composables (#28114)
- kit: Ensure
getNuxtVersion
returnsstring
(#28125) - nuxt: Always prerender at least one page with crawler (#28131)
- nuxt: Consider doc
scroll-padding-top
in scrollBehavior (#28083) - nuxt: Only warn when
useAsyncData
returns undefined (#28154) - nuxt: Revert change to
getCachedData
null response (d10cea11b) - schema: Don't use
app/
assrcDir
if it doesn't exist (#28176) - kit: Normalise
serverDir
within layers using v4 compat (#28177) - nuxt: Allow
getCachedData
to return undefined (#28187) - nuxt: Use
addEventListener
to register cookie store listener (#28193) - nuxt: Merge route meta properties with scanned meta (#28170)
- nuxt: Prevent duplicate
set-cookie
headers (#28211)
💅 Refactors
- schema,vite,webpack: Rework
postcss
module loading (#27946) - nuxt: Remove
_registeredComponents
from ssrContext (#27819) - nuxt: Use
errx
to handle dev log traces (#28027)
📖 Documentation
- Fix link (83bd4fde9)
- Fix Cloudflare spelling (#27989)
- Update example to use
nuxtApp.runWithContext
(#28000) - Remove deprecated
pending
variable from data fetching docs (#28011) - Clarify xrsp danger (#28053)
- Deprecate pending and emphasis undefined (#28113)
- Update phrasing in route announcer (#28108)
- Use code groups for install commands in module guide (#28094)
- Capitalize text (#28056)
- Mention content in upgrade guide v4 folder structure (#28090)
- Remove a resolved issue from view transition docs (#28091)
- Clarify navigateTo is not for nitro routes (#28092)
- Warn about nested islands (#28062)
- Add info about
layers/
directory (#28128) - Codemods for migrating to Nuxt 4 (#28072)
✅ Tests
- Add
typeCheck
test in minimal build (#28166)
🤖 CI
❤️ Contributors
- Daniel Roe (@danielroe)
- arshcodemod (@arshcodemod)
- xjccc (@xjccc)
- Julien Huang (@huang-julien)
- BoogieBen (@boogie-ben)
- Santiago A (@santiagoaloi)
- Bobbie Goede (@BobbieGoede)
- John Tanzer (@moshetanzer)
- Thomas (@ThomasWT)
- @beer (@iiio2)
- Dominic (@rexhent)
- Alex Liu (@Mini-ghost)
- Florian Metz (@Timeraa)
- Liran Tal (@lirantal)
- Daniel Kelly (@danielkellyio)
- Daniel Flanagan (@FlantasticDan)
- 山吹色御守 (@KazariEX)
- izzy goldman (@izzygld)
- Anthony Fu (@antfu)
v3.12.3
3.12.3 is the next regularly scheduled patch release.
👉 Changelog
🔥 Performance
- nuxt,vite: Use native fs utils rather than
fs-extra
(#27787) - schema: Use
chokidar
when a customsrcDir
is provided (#27871) - nuxt: Ensure
prefetchComponents
is treeshaken on server (#27905)
🩹 Fixes
- nuxt: Flag async data promise as cancelled only if defined (#27690)
- schema: Handle backwards compat for
dir.app
(0c73cb734) - nuxt: Support hoisting types of subpath imports (#27720)
- nuxt: Resolve routes when
navigateTo
called withopen
(#27742) - nuxt: Handle subpaths more correctly (d7402a799)
- nuxt: Delay navigation until user input is acknowledged (#27743)
- nuxt: Resolve aliases used in nitro plugin paths (#27741)
- schema: Do not use full path assets/public aliases (d0518650f)
- nuxt: Defer registering inp handler until nuxt is mounted (866a5319a)
- nuxt: Add
refresh
type in server component refs (#27778) - nuxt: Extract all-literal page meta (#27821)
- kit: Handle loading nuxt 4+ (cf251bd48)
- nuxt: Handle external links to named route objects (#27829)
- nuxt: Use URL to encode redirected URLs (#27822)
- nuxt: Don't use app version when verifying nuxt deps (#27864)
- nuxt: Prompt to set compatibility date with latest nitro (#27893)
- nuxt: Add
#vue-router
alias for backwards compat (#27896) - nuxt: Move app augments to core
nuxt
types (#27900) - nuxt: Pass augmented pages to child paths (ecb35d3a2)
- nuxt: Use pascal name when loading server component (#27928)
- nuxt: Improve async data warning (#27874, #27934)
- nuxt: Allow configuring server components in modules (#27936)
- vite: Omit css
?raw
from head when in dev mode (#27940) - kit,nuxt: Ensure webworker types are available (4cab71d66)
- nuxt: Seed crawler when prerendering pages (#27955)
- vite: Fix type issue with legacy dev bundler (f9fa1a3e9)
- nuxt: Improve dx around compatibility date prompt (#27965)
💅 Refactors
- kit,nuxt: Use
performance.now
to measure time (d14f7ec46)
📖 Documentation
- Add referral query variable to Vue School Links (#27670)
- Fix variable name (#27675)
- Clarify how transitions are configured globally (#27679)
- Remove outdated recommendation (#27691)
- Add
refreshCookie
onuseCookie
doc page (#27744) - Sync changes from
main
branch (e7fbc9f81) - Remove outdated tip (#27773)
- Warn about awaiting
useFetch
/AsyncData
in wrappers (#27785) - Update some code groups with package manager examples (#27791)
- Hint to use runtime config (#27859)
- Use internal link (#27883)
- Update links to
vue-router
docs (#27895) - Use internal link (#27894)
- Remove warning about type checking (#27911)
compatibilityVersion
is available in the latest release (#27919)- Update roadmap + readme (748bc751d)
- Update
Nuxt 3
->Nuxt
orNuxt 3+
(3c16c890c) - Update reference to nightly release for testing nuxt 4 (5d2dc9714)
- Remove duplicate server-side notice in runtime config (#27929)
- Warn about ref unwrapping when auto-importing
ref
s (#27933) - Mention layers in directory guide (c222fe7aa)
🏡 Chore
- Use absolute urls for sources to assets in readme (5ef305cec)
- Use relative links and update in build script (7dd15186e)
- Use backup file extension (a42a3869b)
- Allow changelogs with breaking changes (e11587189)
- Allow major bumps (dea0b86c7)
- Add
4x
tag for v4 nightly releases (9d5dd5494) - vite: Restore utils required for
dev-bundler
(e3448fa0d) - Remove nitro/h3 from renovate, and reenable vitejs/vue (9037b0d2c)
- Improve type safety with indexed access (#27626)
- Add @danielroe to code owners (7fa957729)
- Remove renovate configuration from
2.x
branch (8003cf72f) - Remove issue template for 2.x (9f9fb9251)
- Remove unused variable (f07969d88)
✅ Tests
- schema: Normalize snapshot paths for windows (#27654)
- nuxt: Normalize paths for windows (#27653)
- Bump timeout for node-compat test (228b8b889)
- Slightly improve test reliability (#27811)
🤖 CI
- Update changelog from 3.x branch updates (2b6967fbb)
- Add 3x tag instead (c0ef279f2)
- Run workflows against 3.x branch as well (31255a14d)
- Use correct SHA calculation for release-pr action (#27604)
- Resolve bash syntax error (#27789)
- Only run scorecards against
main
branch (7abd982f8) - Raise renovate prs against 3.x branch too (f176c150a)
- Ignore
@vitejs/plugin-vue
again (56660cbdd) - Prevent more than one release from occurring at same time (71705550f)
- Don't run changelog update on 2.x branch (1be639364)
❤️ Contributors
- Daniel Roe (@danielroe)
- Typed SIGTERM (@typed-sigterm)
- Seno (@s-en-o)
- Julien Huang (@huang-julien)
- Michael Brevard (@GalacticHypernova)
- Ryota Watanabe (@wattanx)
- Martin Masevski (@Archetipo95)
- Alex Liu (@Mini-ghost)
- Bochkarev Ivan (@Ibochkarev)
- Alexander Lichter (@manniL)
- Dominic (@rexhent)
- Aviv Keller (@RedYetiDev)
- Maxime Pauvert (@maximepvrt)
- Daniel Kelly (@danielkellyio)
- Damian Głowala (@DamianGlowala)
- Idorenyin Udoh (@idorenyinudoh)
v2.18.1
👉 Changelog
🩹 Fixes
- webpack: Depend on earlier version of
mkdirp
(f67056b9e)
❤️ Contributors
- Daniel Roe (@danielroe)
v2.18.0
👉 Changelog
🚀 Enhancements
- webpack: Migrate to
memfs
(#27652)
🩹 Fixes
- vue-app: Don't throw if we can't read
sessionStorage
(#27662) - config: Add back md4 monkey-patch for wider ecosystem (#27865)
🏡 Chore
- Bump internal versions (9e829b59a)
- Add non-applicable advisory GHSA-3h5v-q93c-6h6q (5ef7311f0)
❤️ Contributors
- Daniel Roe (@danielroe)
v3.12.2
3.12.2 is the a regularly scheduled patch release.
✅ Upgrading
As usual, our recommendation for upgrading is to run:
npx nuxi@latest upgrade --force
This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the unjs ecosystem.
👉 Changelog
🔥 Performance
- kit: Deduplicate layers before resolving config (#27582)
- webpack: Decrease assets map iterations (d929cd4ef)
- kit: Various performance improvements (#27600)
- vite: Various performance improvements (#27601)
- nuxt: Don't wait for key deps check (#27638)
🩹 Fixes
- nuxt: Call
onNuxtReady
callback without arguments (#27428) - schema: Don't narrow head string types to literals (#27540)
- schema:
app/
dir backwards compatibility (#27529) - nuxt: Manually assign payload reactivity when
ssr: false
(#27542) - nuxt: Only log warning once per
runtimeConfig
key (9e56b60c6) - nuxt: Overwrite
#app/defaults
rather than augmenting (#27567) - nuxt: Export
useRouteAnnouncer
(#27562) - nuxt: Remove backticks around runtimeConfig warning log (#27549)
- nuxt: Close top-level watcher on nuxt 'close' (#27571)
- nuxt: Handle tsx code when extracting pageMeta/routeRules (#27583)
- nuxt: Handle more edge cases with external/custom links (#27487)
- nuxt: Preserve route metadata assigned outside page (#27587)
- nuxt: Use portal to sync nitro/nuxt runtimeConfig + routeRules (#27596)
- nuxt,schema: Add types for
_installedModules
(e4bfea642) - nuxt: Include build-time pages in prerender routes (#27569)
- nuxt: Warn when async data doesn't return a value (#27599)
- nuxt: Replace deprecated
app.rootId
withapp.rootAttrs.id
(#27630) - nuxt: Add
mergeProps
import in islands transform (#27622) - nuxt: Reset cookie timeoutLength after expiration (#27632)
- nuxt: Add missing island uid for selective client components (#27633)
- schema,vite: Respect
vite.cacheDir
if defined (#27628) - nuxt: Unregister hooks the moment
close
is called (#27637) - nuxt: Add missing script stubs (#27640)
- nuxt: Only inject root path in prerender (44cada95a)
- nuxt: Reduce usage of cjs utilities (#27642)
- nuxt: Add
/
even if pages module isn't enabled (dabcb5ecc)
📖 Documentation
- Add warning about bridge migration with
head
(#27575) - Update compatibility example (4b28d2628)
- Document new
clear()
function added in 3.11 (#27615) - String vs object errors + accessing data of server-thrown errors (#27398)
- Correct Cloudflare deployment recommendations (#27641)
🏡 Chore
- Add extra types for empty array definitions (02945b9fa)
- Remove stub types file for
webpack-virtual-modules
(58dd7f3a6) - Lint (cb77ddc30)
✅ Tests
- Add type test for nuxt module resolved types (115fc2d18)
🤖 CI
- Improve generated changelog (d20266961)
❤️ Contributors
- Daniel Roe (@danielroe)
- Julien Huang (@huang-julien)
- Alexandru Ungureanu (@unguul)
- Josh Dean (@jdbdnz)
- Yusuf Mansur Özer (@ymansurozer)
- Matteo Rigoni (@Rigo-m)
- Leo Osa (@leoosa)
- Levi (Nguyễn Lương Huy) (@huynl-96)
- David Nahodyl (@Smef)
- Michael Brevard (@GalacticHypernova)
- garthreckers (@garthreckers)
- Valerii Strilets (@letstri)
- Okuto Oyama (@yamanoku)
- Harlan Wilton (@harlan-zw)
v2.17.4
👉 Changelog
🩹 Fixes
- types: Bump
serve-static
types to v1.15.7 (1c44c376d) - generator: Use maintained
html-minifier-terser
(#26914) - vue-app: Prevent double page mount (#10874)
- core: Don't skip loading runtime modules if one is improperly resolved (#10193)
- vue-app: Prevent error page mounting twice (#27484)
🏡 Chore
- Update repository field for
@nuxt/config
(c283cc039) - Mark GHSA-2p57-rm9w-gvfp as not applicable (4782e3c90)
- Update repository urls (07668eafb)
- Mark GHSA-grv7-fg5c-xmjg as not applicable (eeb6207c9)
- Refresh yarn lockfile (#27612)
✅ Tests
- Properly close
page
in e2e tests (1700aa131) - Wait for navigation in redirect test (e74715606)
- Don't register promise in external nav (#27468)
🤖 CI
- Add label PR workflow (#25580)
- Make edge releases on commit basis (1eb08d1ba)
- Remove ref for release workflows (06f91349f)
- Don't skip tests from branch named
dev
(2a5d05257) - Update test conditions (940fc7dcb)
❤️ Contributors
- Dmitriy (@Kolobok12309)
- Ivan Ehreshi (@IvanEh)
- Daniel Roe (@danielroe)
- Damian Głowala (@DamianGlowala)
v3.12.1
3.12.1 is a hotfix release to address a typo in the nuxt/script stub auto-imports.
👉 Changelog
🩹 Fixes
- nuxt: Update registry list for
@nuxt/scripts
(0252000d7)
💅 Refactors
- schema: Use
CompatibilityDateSpec
(#27521)
📖 Documentation
🏡 Chore
✅ Tests
- Update scrolling test (52b85a886)
❤️ Contributors
- Daniel Roe (@danielroe)
- Pooya Parsa (@pi0)
- Alexander Lichter (@manniL)
v3.12.0
👀 Highlights
We're on the road to the release of Nuxt 4, but we've not held back in Nuxt v3.12. A huge thank you to the 75+ Nuxt contributors and community members who have been part of this release. ❤️
🚀 Testing Nuxt 4 changes
Nuxt 4 is on the horizon, and it's now possible to test out the behaviour changes that will be coming in the next major release (#26925) by setting an option in your nuxt.config
file:
export default defineNuxtConfig({
future: {
compatibilityVersion: 4,
},
})
As we've been merging PRs for Nuxt 4, we've been enabling them behind this flag. As much as possible we're aiming for backwards compatibility - our test matrix is running the same fixtures in both v3 and v4 compatibility mode.
There is a lot to say here, with 10+ different PRs and behaviour changes documented and testable, but for full details, including migration steps, see the v4 upgrade documentation.
We'd be very grateful for early testing of what's coming in Nuxt 4! 🙏
📜 Nuxt Scripts auto-install
We've been gradually working to release Nuxt Scripts. It's currently in public preview, but we're near a public release, so we've added some stubs for composables that (when used) will prompt installing the @nuxt/scripts
module.
👉 Watch out for the launch - and an article explaining more!
🌈 Layer auto-registration and bugfixes
Just like ~/modules
, any layers within your project in the ~/layers
directory will now be automatically registered as layers in your project (#27221).
We also now correctly load layer dependencies, which should resolve a range of issues with monorepos and git installations (#27338).
🌐 Built-in accessibility improvements
We now have a built-in <NuxtRouteAnnouncer>
component and corresponding useRouteAnnouncer
composable, which will be added by default to new Nuxt templates going forward.
For full details, see the original PR (#25741) and documentation.
We're continuing to work on nuxt/a11y
- expect to hear more on that in future!
🔥 Performance improvements
We've landed some performance improvements as well, many of which are behind the compatibilityVersion: 4
flag, such as a move away from deeply reactive asyncData payloads.
Significant improvements include deduplicating modules (#27475) - which will apply mostly to layer users who specify modules in their layers. In one project, we saw 30s+ improvement in starting Nuxt.
We've also improved Vite dev server start up time by excluding common ESM dependencies from pre-bundling, and would suggest module authors consider doing the same (#27372).
We improved chunk determinism, so sequential builds should be less likely to have completely different chunk hashes (#27258).
And we tree shake more client-only composables from your server builds (#27044), and have reduced the size of server component payloads (#26863).
👨👩👧👦 Multi-app support
We've landed a couple of changes that take us toward a place of supporting multi-app natively in Nuxt, including a multiApp
experimental flag (#27291) and the ability to have multiple Nuxt app instances running in parallel at runtime (#27068).
While it's not yet ready, please do follow along on the tracker issue, and feel free to pitch in if this is interesting to you.
⛑️ DX wins
We now serialise more things in your dev server logs, including VNodes (#27309) and URLs. We also addressed a bug that could lead to a frozen dev server.
When accessing private runtime config in the browser, we now let you know with a more informative error message (#26441).
🪨 Stabilising features
We've removed some experimental options that have been stabilised and which we feel no longer need to be configurable:
experimental.treeshakeClientOnly
(enabled by default since v3.0.0)experimental.configSchema
(enabled by default since v3.3.0)experimental.polyfillVueUseHead
(disabled since v3.4.0) - implementable in user-land with pluginexperimental.respectNoSSRHeader
(disabled since v3.4.0) - implementable in user-land with server middleware
We've also enabled scanPageMeta
by default (#27134). This pulls out any page metadata in your definePageMeta
macro, and makes it available to modules (like @nuxtjs/i18n
) so they can augment it.
This unlocks much better module/typed routing integration, but has a potential performance cost - so please file an issue if you experience any problems.
💪 Type improvements
We now have support for typed #fallback
slots in server components (#27097).
We've also improved some defaults in your generated tsconfig.json
, including setting module: 'preserve'
if you have a locally installed TypeScript v5.4 version (see docs) - see #26667, #27485.
📦 Module author/power user improvements
We have shipped a range of type improvements for module authors, including:
- support for typed module options in
installModule
(#26744) - the option to specify compatibility with certain builders (vite/webpack) in module options (#27022)
- a new
onPrehydrate
hook for hooking into the browser hydration cycle (#27037) - the ability to access and update resolved runtime configuration within modules, with new build-time
useRuntimeConfig
andupdateRuntimeConfig
utils (#27117)
🎨 Inlined UI templates
If you previously used @nuxt/ui-templates
then it may be worth knowing that we have moved them from a separate repository into the nuxt/nuxt monorepo. (This is purely a refactor rather than a change, although you can expect some new designs for Nuxt v4.)
✅ Upgrading
As usual, our recommendation for upgrading is to run:
npx nuxi@latest upgrade --force
This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the unjs ecosystem.
👉 Changelog
🚀 Enhancements
- nuxt: Support passing options to
useRequestURL
(#26687) - nuxt: Introduce
imports.scan
option (#26576) - nuxt: Add
<NuxtRouteAnnouncer>
anduseRouteAnnouncer
(#25741) - kit: Handle virtual files in
resolvePath
andfindPath
(#26465) - nuxt: Expose
useLink
fromNuxtLink
(#26522) - schema: V4 opt-in with
future.compatibilityVersion
(#26925) - nuxt,schema: Inline error, welcome, spa-loading templates (#27021)
- nuxt: Configurable
app.rootAttrs
andteleportAttrs
(#27014) - schema: Enable
cookieStore
by default (f597ca59a) - nuxt,schema: Support new Nuxt folder structure (#27029)
- nuxt: Treeshake
onUpdated
andonUnmounted
on server (#27044) - nuxt: Prompt to install
nuxt/scripts
on usage (#27010) - nuxt: Expose default slot from
<NuxtPage>
(#27050) - nuxt: Custom
renderSSRHeadOptions
config forunhead
(#26989) - nuxt: Add
onPrehydrate
lifecycle hook (#27037) - nuxt: Support multiple nuxtApps at runtime (#27068)
- nuxt: Add
#fallback
slot to server components types (#27097) - nuxt: Allow specifying builder compatibility in modules (#27022)
- kit: Add
useRuntimeConfig
andupdateRuntimeConfig
utils (#27117) - schema: Remove some experimental options for v4 (#27132)
- nuxt: Auto-register layers in
layers/
directory ([#27221](https://githu...