👀 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 and updateRuntimeConfig 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
compare changes
🚀 Enhancements
- nuxt: Support passing options to
useRequestURL (#26687)
- nuxt: Introduce
imports.scan option (#26576)
- nuxt: Add
<NuxtRouteAnnouncer> and useRouteAnnouncer (#25741)
- kit: Handle virtual files in
resolvePath and findPath (#26465)
- nuxt: Expose
useLink from NuxtLink (#26522)
- schema: V4 opt-in with
future.compatibilityVersion (#26925)
- nuxt,schema: Inline error, welcome, spa-loading templates (#27021)
- nuxt: Configurable
app.rootAttrs and teleportAttrs (#27014)
- schema: Enable
cookieStore by default (f597ca59a)
- nuxt,schema: Support new Nuxt folder structure (#27029)
- nuxt: Treeshake
onUpdated and onUnmounted on server (#27044)
- nuxt: Prompt to install
nuxt/scripts on usage (#27010)
- nuxt: Expose default slot from
<NuxtPage> (#27050)
- nuxt: Custom
renderSSRHeadOptions config for unhead (#26989)
🔥 Performance
- nuxt: Don't add client fallback plugin if not enabled (#26666)
- nuxt: Unsubscribe from
asyncData watch when unmounted (#26821)
- nuxt: Remove state from nuxt island response (#26863)
- nuxt: Emit simpler functional ui templates (w/o lodash) (#27091)
- ui-templates: Don't emit message data for pure strings (9b1bfe69e)
- nuxt: Remove
ssrContext.styles reference (from unused vue-style-loader) (2d1ab61b2)
- nuxt: Mark payload as
shallowReactive (#27214)
- nuxt: Abort vue render when plugins throw error (#27304)
- vite: Exclude common ESM deps from pre-bundling (#27372)
- kit,nuxt: Remove handling for node 14 perf api (#27396)
- nuxt: Deduplicate modules to install (#27475)
- webpack: Decrease iteration count and improve type safety (#27488)
🩹 Fixes
- nuxt: Prevent
getCachedData from shaping type of useAsyncData (#25946)
- nuxt: Encode location header in navigateTo (#26712)
- nuxt: Correctly remove extension from path in
hasSuffix (#26725)
- nuxt: Hint prerenderer to crawl routes at runtime (#26694)
- kit: Ignore negation when resolving ignore patterns (e105fadd7)
- nuxt: Avoid double-slash in ignore pattern (75e43ac42)
- kit: Set typescript
moduleDetection to 'force' (#26667)
- nuxt: Re-initialise
nuxt._ignore after all modules run (#26680)
- nuxt: Assign
v-for to slot in islands (#26880)
- nuxt: Don't encode location header (#26893)
- nuxt: Check if
_scope is active before calling run function (#26756, #26904)
- nuxt: Don't scan component dirs when
enabled is false (#26906)
- vite: Inline styles for vue components with
lang="ts" (#26912)
- nuxt: Handle arrays correctly in
updateAppConfig (#26949)
💅 Refactors
- Improve regexp performance (#27207)
📖 Documentation
- Update Nuxt 4 scheduled release date (#26663)
- Remove step of installing deps in new nuxt project (#26676)
- Clarify
dependsOn works not just for parallel plugins (#26707)
- Add
--preset flag for nuxi build (#26759)
- Fix typo (#26752)
- Remove misleading reference to
useFetch (#26748)
- Update the code style page (#26792)
- Reference correct composable in
callWithNuxt (#26771)
- Add sample app.vue (#26796)
- Remove direct link to subheading (#26775)
- Fix
srcDir description mentioning deprecated static/ directory (#26804)
- Provide example of passing props to a child page (#26805)
- Provide example of exposing a
pageRef from a child page (#26806)
- Correct definePageMeta scrollToTop docs link (#26829)
- Advise correct extension for vitest config (#26845)
- Deprecate
pending value in data fetching composables (#26766)
- Fix file name (#26852)
- Add info about self-hosted github/gitlab instances (#26501)
📦 Build
- nuxt: Use relative path to ui-templates dist (99dc3ce88)
- schema: Use relative path to ui-templates dist (eec84f5b2)
- ui-templates: Directly copy templates on build (#27430)
- ui-templates: Fix svg regexp (957dcc194)
🏡 Chore
- Update
moduleResolution to Bundler (#26658)
- Cleanup eslint rules with latest
@nuxt/eslint-config (#26653)
- Fix
devcontainer.json syntax (#26776)
- Ignore SSL certificate error with
conventionalcommits.org (9ba1ebe98)
- Fix small typos (#26907)
- Add
@nuxt/ui-templates to core monorepo (fe6bdcc01)
- Skip releasing
ui-templates (15781c608)
- Build ui-templates first (1add938a5)
- ui-templates: Remove legacy artifacts (3d2f93d5a)
- Update lockfile (447db137a)
- Dedupe (94a6f0581)
- ui-templates: Misc improvements (#27033)
- Disable jiti_cache when running vitest (2786595f5)
- Upgrade dev dependencies (061fbd4bd)
- For goodness' sake (3708ee872)
- Update root monorepo node engine (#27122)
- Move
@internal comment (cf736e274)
- Remove redundant
eslint-plugin-regexp (#27271)
✅ Tests
🤖 CI
- Avoid running some actions on forks (#26937)
- Allow
ui-templates as valid scope (5afd75b88)
- Use commit hash at time of release triggger (b78817001)
- Remove nightly nuxt 2 releases (bf4e6c536)
❤️ Contributors
- Daniel Roe (@danielroe)
- Maik Kowol (@94726)
- Ryan Clements (@RyanClementsHax)
- Hendrik Heil (@hendrikheil)
- Pooya Parsa (@pi0)
- Damian Głowala (@DamianGlowala)
- Inesh Bose (@ineshbose)
- André Luiz da Silva (@andresilva-cc)
- Luke Nelson (@luc122c)
- nopeless (@nopeless)
- Israel Ortuño (@IsraelOrtuno)
- Jakub Bednár (@jakubednar)
- praburangki (@praburangki)
- JD Solanki (@jd-solanki)
- Julien Huang (@huang-julien)
- Jakub Szafrański (@samupl)
- @beer (@iiio2)
- Anthony Fu (@antfu)
- Horu (@HigherOrderLogic)
- Maxime Pauvert (@maximepvrt)
- Miha Sedej (@tresko)
- Lasse Diercks (@lassediercks)
- Sébastien Chopin (@Atinux)
- Nicolas Payot (@nicolaspayot)
- yubo (@itchina110)
- Kim-Lan (@Kim-Lan)
- Deth (@dethdkn)
- Martins Zeltins (@martinszeltins)
- Ryota Watanabe (@wattanx)
- Alexander Lichter (@manniL)
- Dominik Opyd (@oritwoen)
- Michael McAndrew (@michaelmcandrew)
- gangan (@shinGangan)
- Alex Liu (@Mini-ghost)
- ynnsuis (@sossost)
- AngelHdz Multimedia (@angelhdzmultimedia)
- David (@dbzx10299)
- Danila Rodichkin (@daniluk4000)
- Harlan Wilton (@harlan-zw)
- Shizuku (@ifshizuku)
- zer0fire (@zer0fire)
- Will Willems (@willwillems)
- Pothuraju (@pothuraju-dev)
- xjccc (@xjccc)
- Cedric (@ceddy4395)
- Fabian B (@madebyfabian)
- Alexandr (@BubbleSortt)
- rgehbt (@Gehbt)
- Adam Hudák (@adam-hudak)
- Babak Farkhoopak (@babakfp)
- Trent Fellbootman (@Trent-Fellbootman)
- John Tanz (@moshetanzer)
- Alexandros Kazantzidis (@Alexandros23Kazantzidis)
- Joaquín Sánchez (@userquin)
- Turdalin Nurassyl (@trdln)
- Louis Ramos (@wJoenn)
- Nate (@navanjr)
- Ivan Kalachikov (@ivan-kalachikov)
- Edwin Fadul (@edwinfadul)
- kawadah (@kawadah)
- Mehdi (@mehdi-coding)
- Shao (@shao-wang-me)
- OrbisK (@OrbisK)
- Taras Batenkov (@enkot)
- Han (@fenghan34)
- RollingTL (@RollingTL)
