Name | Modified | Size | Downloads / Week |
---|---|---|---|
Parent folder | |||
README.md | 2025-07-28 | 11.6 kB | |
v3.18.0 source code.tar.gz | 2025-07-28 | 1.4 MB | |
v3.18.0 source code.zip | 2025-07-28 | 1.9 MB | |
Totals: 3 Items | 3.3 MB | 0 |
3.18.0 is the next minor release.
👀 Highlights
A huge thank you to everyone who's been a part of this release, which is mostly about backporting features + bugfixes from Nuxt v4.
Over the next six months, we'll continue backporting compatible v4 features and bug fixes, so please keep the feedback coming! ❤️
🧪 Lazy Hydration Macros
Building on the delayed hydration support from v3.16, we now support lazy hydration macros (#31192)! These provide a more ergonomic way to control component hydration:
:::vue
<script setup lang="ts">
const LazyHydrationMyComponent = defineLazyHydrationComponent(
'visible',
() => import('./components/MyComponent.vue')
)
</script>
<template>
<div>
<!--
Hydration will be triggered when
the element(s) is 100px away from entering the viewport.
-->
<LazyHydrationMyComponent :hydrate-on-visible="{ rootMargin: '100px' }" />
</div>
</template>
These macros make it possible to use Nuxt's lazy hydration utilities alongside explicit component imports.
♿️ Accessibility Improvements
We've enhanced accessibility by including <NuxtRouteAnnouncer>
in the built-in app.vue
(#32621). This means page changes will be announced to screen readers, making navigation more accessible for users with visual impairments. (This only applies if you do not have an app.vue
in your project. If you do, please keep <NuxtRouteAnnouncer>
in your app.vue
!)
🛠️ Enhanced Development Experience
Chrome DevTools Workspace Integration
We've added Chrome DevTools workspace integration (#32084), allowing you to edit your Nuxt source files directly from Chrome DevTools. This creates a better debugging experience where changes made in DevTools are reflected in your actual source files.
Better Component Type Safety
Component type safety has been improved with:
- Typed slots for
<ClientOnly>
and<DevOnly>
(#32707) - better IntelliSense and error checking - Exported
<NuxtTime>
prop types (#32547) - easier to extend and customize
New Auto-Import: onWatcherCleanup
The onWatcherCleanup
function from vue
is now available as an auto-import (#32396), making it easier to clean up watchers and prevent memory leaks:
:::ts
const { data } = useAsyncData('users', fetchUsers)
watch(data, (newData) => {
const interval = setInterval(() => {
// Some periodic task
}, 1000)
// Clean up when the watcher is stopped
onWatcherCleanup(() => {
clearInterval(interval)
})
})
📊 Observability Enhancements
Page routes are now exposed to Nitro for observability (#32617), enabling better monitoring and analytics integration with supported platforms. This allows observability tools to track page-level metrics more effectively.
🔧 Module Development Improvements
Module authors get several quality-of-life improvements:
Simplified Server Imports
The addServerImports
kit utility now supports single imports (#32289), making it easier to add individual server utilities:
:::ts
// Before: had to wrap in array
addServerImports([{ from: 'my-package', name: 'myUtility' }])
// Now: can pass directly
addServerImports({ from: 'my-package', name: 'myUtility' })
TypeScript Configuration
Modules can now add to typescript.hoist
(#32601), giving them more control over TypeScript configuration and type generation.
⚡️ Performance Improvements
We've made several performance optimizations:
- Improved Vite-node communication via internal socket (#32417) for faster development builds
- Migration to
oxc-walker
(#32250) and oxc foronPrehydrate
transforms (#32045) for faster code transformations
🐛 Bug Fixes
This release also includes several important fixes:
- Improved data fetching: When computed keys change, old data is now properly retained (#32616)
- Better scroll behavior:
scrollBehaviorType
is now only used for hash scrolling (#32622) - Fixed directory aliases: Added trailing slashes to some directory aliases for better consistency (#32755)
✅ Upgrading
As usual, our recommendation for upgrading is to run:
:::sh
npx nuxi@latest upgrade --dedupe
This refreshes your lockfile and pulls in all the latest dependencies that Nuxt relies on, especially from the unjs ecosystem.
👉 Changelog
🚀 Enhancements
- nuxt: Expose page routes to nitro for o11y (#32617)
- nuxt: Export
<NuxtTime>
prop types (#32547) - nuxt: Add integration with chrome devtools workspaces (#32084)
- kit: Support single import in
addServerImports
(#32289) - nuxt: Add
onWatcherCleanup
to imports presets (#32396) - nuxt: Add route announcer to default app.vue (#32621)
- nuxt: Support lazy hydration macros (#31192)
🔥 Performance
- vite: Communicate with vite-node via internal socket (#32417)
- kit: Update env expansion regex to match nitro (#30766)
🩹 Fixes
- nuxt: Allow modules to add to
typescript.hoist
(#32601) - nuxt: Retain old data when computed key changes (#32616)
- nuxt: Only use
scrollBehaviorType
for hash scrolling (#32622) - nuxt: Add missing
async
(fd312af03) - nuxt: Fix transform/minify types + bump oxc-transform (d2ba19963)
- nuxt: Provide typed slots for
<ClientOnly>
and<DevOnly>
(#32707) - kit,nuxt,schema: Add trailing slash to some dir aliases (#32755)
- nuxt: Include source base url for remote islands (#32772)
- vite: Use vite node server to transform requests (#32791)
- kit: Use
mlly
to parse module paths (#32386) - nuxt: Execute all plugins after error rendering error.vue (#32744)
💅 Refactors
- nuxt: Migrate to
oxc-walker
(#32250) - nuxt,schema: Use oxc for
onPrehydrate
transform (#32045) - nuxt: Pass file language directly to parser options (#32665)
- nuxt: Use direct import of
installNuxtModule
(228e3585e)
📖 Documentation
- Pass
v3
template to create nuxt examples (03182202f) - Add reference to
useNuxtData
in data fetching composable pages (#32589) - Document the --modules flag in the init command (#32599)
- Added new Shared folder to the example of v4 folder structure (#32630)
- Improve grammar (#32640)
- Typos (#32567)
- Fix abbreviation (#32613)
- Reference
noUncheckedIndexedAccess
rule change in v4 guide (#32643) - Fix links to Nitro docs (#32691)
- Add best practices section (#31609)
- Correct alias for local fonts in styling guide (#32680)
- Update nuxt.new links to v4 (#32639)
- Set correct default value for deep option in usefetch (#32724)
- Fix link to issue (ca03f533f)
- Add AI-assisted contribution guidelines (#32725)
- Update Nuxt installation command to use
npm create nuxt@latest
(#32726) - Hydration best practice (#32746)
- Add example for module
.with()
(#32757) - Replace dead Vue Router docs links (#32779)
🏡 Chore
- Handle missing commit details (0af98763d)
- Update reproduction links for bug-report template (#32722)
- Update
unbuild
and use absolute path in dev stubs (#32759)
✅ Tests
- Also assert status (4b4b224f7)
- Ignore vue
module.exports
export (ac8b02d09) - Extend timeout when waiting for hydration (49c01ba81)
- Benchmark minimal fixture instead (#31174)
- Add minimal pages fixture (#30457)
- Bump bundle size (bafa953c3)
🤖 CI
- Trigger website redeploy on main branch (#32695)
- Release
pkg.pr.new
formain
/3.x
branches as well (ca4f0b1da) - Apply
3x
tag to latest v3 release (5e8dfc150)
❤️ Contributors
- Daniel Roe (@danielroe)
- Bobbie Goede (@BobbieGoede)
- Damian Głowala (@DamianGlowala)
- Dog (@dgxo)
- Julien Huang (@huang-julien)
- Yauheni Vasiukevich (@EvgenyWas)
- Alex Liu (@Mini-ghost)
- Robin (@OrbisK)
- Mateleo (@Mateleo)
- Stephen Jason Wang (@stephenjason89)
- Maurits Meester (@mmeester)
- Igor Kononenko (@igorexa34314)
- Alex (@hywax)
- Matej Černý (@cernymatej)
- Alexander Lichter (@TheAlexLichter)
- Hashim Kalam (@hashimkalam)
- Alois Sečkár (@AloisSeckar)
- Haythem Frikha (@Flamenate)
- abeer0 (@iiio2)
- Thomas (@ThomasWT)
- Connor Pearson (@cjpearson)
- dwood-csi (@dwood-csi)