You are browsing Nuxt 2 docs. Go to Nuxt 3 docs, or learn more about Nuxt 2 Long Term Support.

Release Notes

Discover all the release notes for the Nuxt framework

A landscape image A landscape image

Version v3.16.0

Released on March 7, 2025

👀 Highlights

There's a lot in this one!

⚡️ A New New Nuxt

Say hello to create-nuxt, a new tool for starting Nuxt projects (big thanks to @devgar for donating the package name)!

It's a streamlined version of nuxi init - just a sixth of the size and bundled as a single file with all dependencies inlined, to get you going as fast as possible.

Starting a new project is as simple as:

npm create nuxt

screenshot of create nuxt app

Special thanks to @cmang for the beautiful ASCII-art . ❤️

Want to learn more about where we're headed with the Nuxt CLI? Check out our roadmap here , including our plans for an interactive modules selector .

🚀 Unhead v2

We've upgraded to unhead v2, the engine behind Nuxt's <head> management. This major version removes deprecations and improves how context works:

  • For Nuxt 3 users, we're shipping a legacy compatibility build so nothing breaks
  • The context implementation is now more direct via Nuxt itself 
// Nuxt now re-exports composables while properly resolving the context
export function useHead(input, options = {}) {
  const unhead = injectHead(options.nuxt)
  return head(input, { head: unhead, ...options })
}

If you're using Unhead directly in your app, keep in mind:

  1. Import from Nuxt's auto-imports or #app/composables/head instead of @unhead/vue
  2. Importing directly from @unhead/vue might lose async context

Don't worry though - we've maintained backward compatibility in Nuxt 3, so most users won't need to change anything!

If you've opted into compatibilityVersion: 4, check out our upgrade guide for additional changes.

🔧 Devtools v2 Upgrade

Nuxt Devtools has leveled up to v2 (#30889 )!

You'll love the new features like custom editor selection, Discovery.js for inspecting resolved configs (perfect for debugging), the return of the schema generator, and slimmer dependencies.

One of our favorite improvements is the ability to track how modules modify your Nuxt configuration - giving you X-ray vision into what's happening under the hood.

👉 Discover all the details in the Nuxt DevTools release notes .

⚡️ Performance Improvements

We're continuing to make Nuxt faster, and there are a number of improvements in v3.16:

  1. Using exsolve for module resolution (#31124 ) along with the rest of the unjs ecosystem (nitro, c12, pkg-types, and more) - which dramatically speeds up module resolution
  2. Smarter module resolution paths (#31037 ) - prioritizes direct imports for better efficiency
  3. Eliminated duplicated Nitro alias resolution (#31088 ) - leaner file handling
  4. Streamlined loadNuxt by skipping unnecessary resolution steps (#31176 ) - faster startups
  5. Adopt oxc-parser for parsing in Nuxt plugins (#30066 )

All these speed boosts happen automatically - no configuration needed!

Shout out to CodSpeed with Vitest benchmarking to measure these improvements in CI - it has been really helpful.

To add some anecdotal evidence, my personal site at roe.dev loads 32% faster with v3.16, and nuxt.com is 28% faster. I hope you see similar results! ⚡️

🕰️ Delayed Hydration Support

We're very pleased to bring you native delayed/lazy hydration support (#26468 )! This lets you control exactly when components hydrate, which can improve initial load performance and time-to-interactive. We're leveraging Vue's built-in hydration strategies - check them out in the Vue docs .

<template>
  <!-- Hydrate when component becomes visible in viewport -->
  <LazyExpensiveComponent hydrate-on-visible />
  
  <!-- Hydrate when browser is idle -->
  <LazyHeavyComponent hydrate-on-idle />
  
  <!-- Hydrate on interaction (mouseover in this case) -->
  <LazyDropdown hydrate-on-interaction="mouseover" />
  
  <!-- Hydrate when media query matches -->
  <LazyMobileMenu hydrate-on-media-query="(max-width: 768px)" />
  
  <!-- Hydrate after a specific delay in milliseconds -->
  <LazyFooter :hydrate-after="2000" />
</template>

You can also listen for when hydration happens with the @hydrated event:

<LazyComponent hydrate-on-visible @hydrated="onComponentHydrated" />

Learn more about lazy hydration in our components documentation .

🧩 Advanced Pages Configuration

You can now fine-tune which files Nuxt scans for pages (#31090 ), giving you more control over your project structure:

nuxt.config.ts
export default defineNuxtConfig({
  pages: {
    // Filter specific files or directories
    pattern: ['**/*.vue'],
  }
})

🔍 Enhanced Debugging

We've made debugging with the debug option more flexible! Now you can enable just the debug logs you need (#30578 ):

nuxt.config.ts
export default defineNuxtConfig({
  debug: {
    // Enable specific debugging features
    templates: true,
    modules: true,
    watchers: true,
    hooks: {
      client: true,
      server: true,
    },
    nitro: true,
    router: true,
    hydration: true,
  }
})

Or keep it simple with debug: true to enable all these debugging features.

🎨 Decorators Support

For the decorator fans out there (whoever you are!), we've added experimental support (#27672 ). As with all experimental features, feedback is much appreciated.

nuxt.config.ts
export default defineNuxtConfig({
  experimental: {
    decorators: true
  }
})

function something (_method: () => unknown) {
  return () => 'decorated'
}

class SomeClass {
  @something
  public someMethod () {
    return 'initial'
  }
}

const value = new SomeClass().someMethod()
// returns 'decorated'

📛 Named Layer Aliases

It's been much requested, and it's here! Auto-scanned local layers (from your ~~/layers directory) now automatically create aliases. You can access your ~~/layers/test layer via #layers/test (#30948 ) - no configuration needed.

If you want named aliases for other layers, you can add a name to your layer configuration:

nuxt.config.ts
export default defineNuxtConfig({
  $meta: {
    name: 'example-layer',
  },
})

This creates the alias #layers/example-layer pointing to your layer - making imports cleaner and more intuitive.

🧪 Error Handling Improvements

We've greatly improved error messages and source tracking (#31144 ):

  1. Better warnings for undefined useAsyncData calls with precise file location information
  2. Error pages now appear correctly on island page errors (#31081 )

Plus, we're now using Nitro's beautiful error handling (powered by youch ) to provide more helpful error messages in the terminal, complete with stacktrace support.

Nitro now also automatically applies source maps without requiring extra Node options, and we set appropriate security headers when rendering error pages.

📦 Module Development Improvements

For module authors, we've added the ability to augment Nitro types with addTypeTemplate (#31079 ):

// Inside your Nuxt module
export default defineNuxtModule({
  setup(options, nuxt) {
    addTypeTemplate({
      filename: 'types/my-module.d.ts',
      getContents: () => `
        declare module 'nitropack' {
          interface NitroRouteConfig {
            myCustomOption?: boolean
          }
        }
      `
    }, { nitro: true })
  }
})

⚙️ Nitro v2.11 Upgrade

We've upgraded to Nitro v2.11. There are so many improvements - more than I can cover in these brief release notes.

👉 Check out all the details in the Nitro v2.11.0 release notes .

📦 New unjs Major Versions

This release includes several major version upgrades from the unjs ecosystem, focused on performance and smaller bundle sizes through ESM-only distributions:

  • unenv upgraded to v2 (full rewrite)
  • db0 upgraded to v0.3 (ESM-only, native node:sql, improvements)
  • ohash upgraded to v2 (ESM-only, native node:crypto support, much faster)
  • untyped upgraded to v2 (ESM-only, smaller install size)
  • unimport upgraded to v4 (improvements)
  • c12 upgraded to v3 (ESM-only)
  • pathe upgraded to v2 (ESM-only)
  • cookie-es upgraded to v2 (ESM-only)
  • esbuild upgraded to v0.25
  • chokidar upgraded to v4

✅ Upgrading

As usual, our recommendation for upgrading is to run:

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

compare changes

🚀 Enhancements

  • nuxt: Upgrade @nuxt/devtools to v2 (#30889 )
  • nuxt: Granular debug options (#30578 )
  • nuxt: Add type hints for NuxtPage (#30704 )
  • nuxt: Support tracking changes to nuxt options by modules (#30555 )
  • nuxt: Allow disabling auto-imported polyfills (#30332 )
  • schema: Add runtime + internal type validation (#30844 )
  • kit,nuxt,schema: Support experimental decorators syntax (#27672 )
  • kit,nuxt: Allow multiple nuxts to run in one process (#30510 )
  • kit: Add named layer aliases (#30948 )
  • kit,nuxt,vite: directoryToURL to normalise paths (#30986 )
  • nuxt: Allow forcing start/set in loading indicator (#30989 )
  • nuxt: Allow specifying glob patterns for scanning pages/ (#31090 )
  • nuxt: Add types for default NuxtLink slot (#31104 )
  • nuxt: Delayed/lazy hydration support (#26468 )
  • vite: Add vite's modulepreload polyfill (#31164 )
  • nuxt: Show source file when warning about undefined useAsyncData (#31144 )
  • kit,nuxt: Augment nitro types with addTypeTemplate (#31079 )
  • kit,nuxt: Resolve template imports from originating module (#31175 )
  • nuxt: Use oxc-parser instead of esbuild + acorn (#30066 )
  • nuxt: Upgrade to unhead v2 (#31169 )
  • nuxt: Align nuxt error handling with nitro (#31230 )

🔥 Performance

  • nuxt: Remove duplicated nitro alias resolution (#31088 )
  • kit: Try non-subpath routes first to resolve nuxt modules (#31037 )
  • nuxt: Migrate to use exsolve for module resolution (#31124 )
  • kit: Skip extra module resolution step in loadNuxt (#31176 )

🩹 Fixes

  • nuxt: Ensure <NuxtLayout> fallback prop is typed (#30832 )
  • nuxt: Assign slot to be rendered for client components (#30768 )
  • nuxt,vite: Do not override vite import conditions (#30887 )
  • nuxt: Prevent keepalive cache reset (#30807 )
  • nuxt: Remove div wrapper in client-only pages (#30425 )
  • schema: Update type import to nitropack (aba75bd5a )
  • vite: Use resolveId from vite-node to resolve deps (#30922 )
  • schema: Normalise additional experimental options (63e0c342c )
  • nuxt: Delete existing properties in app config HMR (#30918 )
  • schema: Return null from resolve functions (d68e8ce57 )
  • schema: Check if app.head.meta values are undefined (#30959 )
  • nuxt: Make shared/ directories available within layers (#30843 )
  • kit: Ensure nuxt is loaded from cwd rather than parent dir (#30910 )
  • ui-templates: Remove extra <pre> when rendering dev errors (9aab69ec4 )
  • nuxt: Use tsx loader for jsx blocks as well (#31014 )
  • Remove unimplemented page:transition:start type (#31040 )
  • kit: Expose module dependency errors (#31035 )
  • nuxt: Deprioritise layer css imports (#31020 )
  • nuxt: Ensure provide / inject work in setup of defineNuxtComponent (#30982 )
  • nuxt: Decode URI components in cache driver methods (#30973 )
  • nuxt: Use _ for NuxtIsland name on server pages (#31072 )
  • nuxt: Use ohash to calculate legacy async data key without hash (#31087 )
  • nuxt,schema: Resolve shared dir from config (#31091 )
  • kit,schema: Set esbuild target for experimental decorators (#31089 )
  • nuxt: Set nuxt.options.pages to detected configuration (#31101 )
  • nuxt: Warn when definePageMeta does not receive an object (#31156 )
  • nuxt: Fix nitro import statements for v2 (151cf7d49 )
  • nuxt: Update path to no-ssr middleware handler (a99c59fbd )
  • nuxt: Align type of custom navigate with vue-router (7a1934509 )
  • nuxt: Show error page on island page error (#31081 )
  • nuxt: Do not render payloads if disabled, and correct regexp (#31167 )
  • nuxt: Add backwards-compatible serialisation for nuxt.options.pages (fa480e0a0 )
  • ui-templates: Escape inline scripts correctly in ui templates (39c2b0a2c )
  • nuxt: Add back fallback nuxtlink type signature (a8856de59 )
  • kit: Provide default extensions in resolveModule (6fb5c9c15 )
  • nuxt: Provide default extensions in resolveTypePath (a0f9ddfe2 )
  • nuxt: Strip query before generating payload url (34ddc2d2f )
  • schema: Resolve workspaceDir to closest git config (7a2fbce01 )
  • kit: Include declaration files when resolving compilerOptions.paths (835e89404 )
  • nuxt: Consolidate head component context (#31209 )
  • nuxt: Resolve shared externals to absolute paths (#31227 )
  • nuxt: Skip deep merge in dev mode for prototype keys (#31205 )
  • schema: Use RawVueCompilerOptions for unresolved tsconfig (#31202 )
  • nuxt: Ensure externals are resolved first (#31235 )
  • nuxt: Ensure we strip all chars in payload url (4f067f601 )
  • nuxt: Exempt nitro from import protections (#31246 )
  • nuxt: Normalise error url to pathname (87b69c9ae )
  • nuxt: Ensure head components are reactive (#31248 )
  • nuxt: Preserve query/hash when calling navigateTo with replace (#31244 )
  • nuxt: Apply ignore rules to nitro devStorage (#31233 )
  • nuxt: Fall back to wasm if oxc native bindings are missing (#31190 )
  • nuxt: Pass useFetch function name on server for warning (#31213 )
  • vite: Prevent overriding server build chunks (89a29e760 )
  • nuxt: Strip query in x-nitro-prerender header (2476cab9a )

💅 Refactors

  • nuxt: Prefer logical assignment operators (#31004 )
  • nuxt: Use isEqual from ohash/utils (2e27cd30c )
  • nuxt: Update to noScripts route rule (#31083 )
  • nuxt: Re-organize internal runtime/nitro files (#31131 )
  • nuxt: Explicitly type internal request fetch (54cb80319 )
  • nuxt: Use relative imports (1bce3dc3b )
  • nuxt: Early return island response (#31094 )

📖 Documentation

  • Tiny typo (#30799 )
  • Fix typo (#30817 )
  • Remove backslashes in spaLoadingTemplate example (#30830 )
  • Update path to nuxt binary (8992c4ea0 )
  • Add nuxt lifecycle (#30726 )
  • Add additional information about NuxtPage (#30781 )
  • Improve navigateTo docs with clearer structure and examples (#30876 )
  • Add auto import info about shared utils (#30858 )
  • Fix typo and improve data fetching examples (#30935 )
  • Clarify that local layers are scanned from rootDir (27e356fe6 )
  • Fix typo (#30963 )
  • Update links to unhead sources (6c520ef74 )
  • Fix typo (#30971 )
  • Add tips on how to override layers aliases (#30970 )
  • Add description for vue:setup and app:data:refresh hooks (#31001 )
  • Mention requirement to wrap middleware in defineNuxtRouteMiddleware (#31005 )
  • Add port option to preview command (#30999 )
  • Remove link to deleted nuxt 2 section (#31077 )
  • Link to the scripts releases page (#31095 )
  • Add .nuxtrc documentation (#31093 )
  • Fix typo in example command (#31112 )
  • Explain why headers not forwarded when using $fetch on the server (#31114 )
  • Fix links to nitro directory structure (5a696176d )
  • Update to use create nuxt command (fe82af4c9 )
  • Update getCachedData types (#31208 )
  • Update code example for nightly release to default to 3x (a243f8fcf )
  • Clarify lifecycle behavior of <NuxtPage> during page changes (#31116 )
  • Mention workaround for typedPages in unhoisted pnpm setups (#31262 )

📦 Build

  • nuxt: Add subpath imports for type support (8ef3fcc4d )

🏡 Chore

✅ Tests

❤️ Contributors

Version v3.15.4

Released on January 29, 2025

3.15.4 is the next 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

compare changes

🩹 Fixes

  • nuxt: Improve error logging when parsing with acorn (#30754 )
  • nuxt: Clear island uid before saving into the payload (#30767 )
  • kit: Load @nuxt/schema from nuxt package dir (#30774 )
  • nuxt: Allow restarting nuxt on paths outside srcDir (#30771 )
  • nuxt: Don't warn about calling useRoute in SFC setup (#30788 )
  • webpack: Disallow cross-site requests in no-cors mode (#30757 )
  • vite: Restore externality for dev server externals (#30802 )

💅 Refactors

  • vite: Use new rollup chunk.names for asset names (#30780 )

❤️ Contributors

Version v3.15.3

Released on January 24, 2025

3.15.3 is the next regularly scheduled patch release.

👀 Highlights

CORS configuration for dev server

Alongside a range of improvements, we've also shipped a significant fix to impose CORS origin restrictions on the dev server . This applies to your Vite or Webpack/Rspack dev middleware only.

This is a significant/breaking change we would not normally ship in a patch but it is a security fix (see https://github.com/nuxt/nuxt/security/advisories/GHSA-4gf7-ff8x-hq99 and https://github.com/nuxt/nuxt/security/advisories/GHSA-2452-6xj8-jh47 ) and we urge you to update ASAP.

You can configure the allowed origins and other CORS options via the devServer.cors options in your nuxt.config, which may be relevant if you are developing with a custom hostname:

export default defineNuxtConfig({
  devServer: {
    cors: {
      origin: ['https://custom-origin.com'],
    },
  },
})

✅ 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

🔥 Performance

  • kit,nuxt: Don't resolve paths from local layers/modules (#30650 )
  • nuxt: Reduce number of mkdirSync calls (#30651 )
  • nuxt: Reduce unnecessary template updating (#30684 )
  • kit: Reduce duplication between findPath and resolvePath (#30682 )
  • kit: Run components compat check synchronously (#30685 )
  • nuxt: Early return from annotation for non-object syntax plugins (#30683 )
  • nuxt: Enable Transition component only on client side (#30720 )

🩹 Fixes

  • vite: Override previous #app-manifest alias (#30618 )
  • kit,nuxt,schema,vite: Improve watching behaviour (#30620 )
  • nuxt: Fall back to plugin.src for variable name generation (#30649 )
  • schema: Allow overriding dev/test environment value (#30667 )
  • vite: Drop unneeded call to invalidate module (d2a95c542 )
  • vite: Add back invalidateModule call (9bd71e498 )
  • nuxt: Do not warn about [[ optional dynamic params (#30619 )
  • vite: Inline shared folder in dev mode (#30690 )
  • nuxt: Deep clone extracted page meta (#30717 )
  • vite,webpack: Restrict access via cors to local origins + allow configuration via devServer.cors (406db5b4d )

💅 Refactors

  • vite: Drop externality and use vite internal config (#30634 )

📖 Documentation

  • Add link to custom useFetch example (#30629 )
  • Fix example command (#30628 )
  • Fix links to nuxi source code (4fabe0025 )
  • Add description for prefetch and other details of NuxtLink (#30614 )
  • Update nuxt/content example (542987627 )
  • Adjust examples, type and description for addRouteMiddleware (#30656 )
  • Explain how to use ClientOnly with onMounted hook (#30670 )
  • Update links to unhead source (eb5344b43 )
  • Add more context about navigation mode in callOnce composable (#30612 )
  • Add example on how to disable default routes for ssg (#30729 )

📦 Build

  • schema: Use new inlineDependencies option (01adefcec )

🏡 Chore

🤖 CI

  • Run bundle size assertion outside of matrix (#30688 )
  • Reenable nuxt benchmarking (#30711 )

❤️ Contributors

Version v3.15.2

Released on January 15, 2025

3.15.2 is the next regularly scheduled patch release.

👀 Highlights

🔥 Startup performance improvements

It is worth noting that this release includes some pretty significant performance improvements which you should notice particularly in the startup time. In my tests in the nuxt monorepo,

fixture time to vite build complete (v3.15.1) time to vite build complete (v3.15.2)
minimal 850ms 710ms
everything bagel 3,021ms 1,690ms

There's more improvement to do here but hopefully these are good numbers!

📦 CLI refactor

To improve performance within Nuxt projects, we've published a new @nuxt/cli distribution of nuxi, which is used under-the-hood in nuxt (see issue ). This should behave exactly the same and nothing needs to be updated in your projects (for example, you will continue to use the nuxi or nuxt commands). The only significant change is that it no longer inlines dependencies. Feedback is welcome 🙏

✅ 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

🔥 Performance

  • nuxt: Remove code duplication in client-only (#30460 )
  • nuxt: Use lighter @nuxt/cli dependency (#30526 )
  • kit: Remove iterations when resolving module path (#30562 )
  • nuxt: Avoid checking fs for existence of scanned pages (#30581 )
  • nuxt: Defer version/config warnings to after build (#30567 )

🩹 Fixes

  • nuxt: Collect all identifiers before extracting page metadata (#30478 )
  • nuxt: Don't hoist identifiers declared locally in definePageMeta when extracting page metadata (#30490 )
  • kit: Reorder #build to the end of tsConfig paths (#30520 )
  • nuxt: Use fullPath instead of empty string in router hmr (#30500 )
  • Relax nuxt version constraints to current (23b968289 )
  • nuxt: Add import protection for @nuxt/cli (618bbc6da )
  • kit: Fully resolve plugin paths when normalising them (#30540 )
  • nuxt: Call page:loading:end only once with nested pages (#29009 )
  • nuxt: Warn about ignored char while parsing route segment (#30396 )
  • nuxt: Allow url-specific chars in vfs (#30584 )
  • nuxt: Do not warn about invalid characters in route groups/catchalls (0249c74bc )
  • vite: Provide fallback alias for #app-manifest (#30587 )
  • nuxt: Avoid invoking shouldPrefetch on the server side (#30591 )
  • nuxt: Decode id before resolving relative imports (#30599 )

💅 Refactors

  • kit,nuxt,webpack: Reduce reassignments (#30589 )

📖 Documentation

  • Document --dev option for the module command (#30477 )
  • Document the add layer command (#30476 )
  • Update v4 release date (#30514 )
  • Ensure correct type for url in useFetch (#30531 )
  • Update link to @nuxt/module-builder source (509cf4a5c )
  • Add status detail and enhance getCachedData readability (#30536 )
  • Update hash link to correct heading (#30543 )
  • Update links to unhead source (fef3a59bb )
  • Adjust example and additional instructions of useNuxtData (#30570 )
  • Resolve many twoslash errors (#30573 )
  • Add context for useAsyncData side effects (#30479 )
  • Update examples to use function declarations for clarity (#30588 )

🏡 Chore

  • Control dependency import into nuxt/app (1adf3e31f )
  • Ignore automated renovate node engines updates (6895993fb )

🤖 CI

  • Don't block release on fixtures + add pkg.pr.new (#30548 )
  • Remove concurrency group from release-pr job (8ac54ff10 )

❤️ Contributors

Version v3.15.1

Released on January 5, 2025

3.15.1 is the next 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

compare changes

🔥 Performance

  • nuxt: Skip experimental async context transform in client build (#30360 )
  • schema: Drop unneeded type-only schema dependencies (#30411 )
  • rspack,webpack: Drop lodash-es dependency (#30409 )
  • nuxt: Drop pathe browser dep for deep server components (#30456 )

🩹 Fixes

  • nuxt: Update module path for defaults (#30371 )
  • nuxt: Ignore non-reference identifiers when extracting page metadata (#30381 )
  • nuxt: Pass nuxt instance to resolvePagesRoutes (e4a372e12 )
  • schema: Support pfx certificate for dev server (#30412 )
  • nuxt: Use node location instead of range for route meta property extraction (#30447 )
  • schema: Override vueCompilerOptions.plugins type (#30454 )
  • nuxt: Respect baseURL when ignoring prerendered manifest (#30446 )
  • nuxt: Respect router.options when hmring routes (#30455 )

💅 Refactors

  • nuxt: Use consola with nuxt tag instead of console (#30408 )

📖 Documentation

  • Update references to lodash and recommend es-toolkit (8e2ca5bdc )
  • Add warning about prerendering (#30437 )

🏡 Chore

❤️ Contributors

Version v3.15.0

Released on December 24, 2024

👀 Highlights

❄️ Snowfall!

Happy holidays! You'll notice when you start Nuxt that (if you're in the Northern Hemisphere) there's some snow on the loading screen (#29871 ).

⚡️ Vite 6 included

Nuxt v3.15 includes Vite 6 for the first time. Although this is a major version, we expect that this won't be a breaking change for Nuxt users (see full migration guide ). However, please take care if you have dependencies that rely on a particular Vite version.

One of the most significant changes with Vite 6 is the new Environment API, which we hope to use in conjunction with Nitro to improve the server dev environment. Watch this space!

You can read the full list of changes in the Vite 6 changelog .

🪵 Chromium devtools improvements

We talk a lot about the Nuxt DevTools, but v3.15 ships with better integration in dev mode for Chromium-based browser devtools.

We now use the Chrome DevTools extensibility API to add support for printing nuxt hook timings in the browser devtools performance panel.

CleanShot 2024-11-14 at 15 05 22@2x

🗺️ Navigation mode for callOnce

callOnce is a built-in Nuxt composable for running code only once. For example, if the code runs on the server it won't run again on the client. But sometimes you do want code to run on every navigation - just avoid the initial server/client double load. For this, there's a new mode: 'navigation' option that will run the code only once per navigation. (See #30260 for more info.)

await callOnce(() => counter.value++, { mode: 'navigation' })

🥵 HMR for templates, pages + page metadata

We now implement hot module reloading for Nuxt's virtual files (like routes, plugins, generated files) as well as for the content of page metadata (within a definePageMeta macro) (#30113 ).

This should mean you have a faster experience in development, as well as not needing to reload the page when making changes to your routes.

📋 Page meta enhancements

We now support extracting extra page meta keys (likely used by module authors) via experimental.extraPageMetaExtractionKeys (#30015 ). This enables module authors to use this information at build time, in the pages:resolved hook.

We also now support local functions in definePageMeta (#30241 ). This means you can do something like this:

function validateIdParam(route) {
  return !!(route.params.id && !isNaN(Number(route.params.id)))
}

definePageMeta({
  validate: validateIdParam,
})

🔥 Performance improvements

We now preload the app manifest in the browser if it will be used when hydrating the app (#30017 ).

We'll also tree shake vue-router's hash mode history out of your bundle if we can - specifically, if you haven't customised your app/router.options.ts (#30297 ).

🐣 v4 updates

A few more changes shipped for the new defaults for v4, including only inlining styles by default for Vue components (#30305 ).

✅ 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

  • deps: Update dependency vite to v6 (3.x) (#30044 )
  • kit: Allow module default options to be async (#29980 )
  • nuxt: Add new types to vue preset (#29819 )
  • nuxt: Experimental extraPageMetaExtractionKeys (#30015 )
  • nuxt,schema: Allow setting serialisable vue app config (#28873 )
  • nuxt: Print nuxt hook timings in browser devtools (#29922 )
  • nuxt: Support vue directive auto-imports within unimport (#29818 )
  • schema: Add snow effect on loading screen in winter (#29871 )
  • nuxt: Support local functions in definePageMeta (#30241 )
  • nuxt: Add mode: 'navigation' to callOnce (#30260 )

🔥 Performance

  • nuxt: Preload app manifest (#30017 )
  • nuxt: Use static hashMode option (#30297 )
  • vite: Use vite to clear screen (#30315 )
  • schema: Only inline styles for vue components (#30305 )
  • nuxt: Remove useId from composable key plugin (#30328 )

🩹 Fixes

  • nuxt: Check if nuxt link observer is null (#30038 )
  • nuxt: Unref the default value of asyncData when clearing (#30041 )
  • kit: Re-export addServerTemplate (a02af2348 )
  • Remove unused dependencies and tidy project (#30043 )
  • vite: Add back some dev-bundler dependencies (976024f16 )
  • nuxt: Do not persist extraExtractionKeys on runtime route.meta (ae9f42f4a )
  • nuxt: Allow array/object style value for head components (#29999 )
  • nuxt: Tidy up remnants of previous useId implementation (40f437d25 )
  • kit,nuxt: Provide buildDir to normalizeTemplate (#30115 )
  • kit: Add better logging for non-resolved modules (#30116 )
  • nuxt: Correct return type of useRequestFetch (#30117 )
  • nuxt,vite: Hmr for templates, pages + page metadata (#30113 )
  • nuxt: Use nitropack rather than nitro import (2d5b53b23 )
  • kit: Use resolved module paths for transpile + modulesDir (#30136 )
  • Update engines.node to match dependencies (#30139 )
  • schema: Allow routerOptions.history to return null (#30192 )
  • nuxt: Render client page directly when not hydrating (#30061 )
  • nuxt: Use useId for island client component teleport id (#30151 )
  • nuxt: De-default async layout components (#30203 )
  • nuxt: Correct types for nuxt and nuxt/app (#30148 )
  • nuxt,schema: Allow showing spa loader til after hydration (#29776 )
  • nuxt: Remove whitespace around spa loading template (070bd103c )
  • nuxt: Hoist environment types (#30230 )
  • schema: Hoist nitro runtime types (73761dade )
  • nuxt: Ensure getRouteRules works with nitro signature (#30277 )
  • nuxt: Respect replace in middleware with navigateTo (#30283 )
  • nuxt: Update import paths for nitropack (f220314a5 )
  • nuxt: Don't use <RouterLink> for links starting with # (#30190 )
  • vite: Ignore optimising #app-manifest (ec613e533 )
  • nuxt: Use useId for client-fallback component uid (#30314 )
  • schema: Gate inline style change behind v4 check (ceac86e34 )
  • nuxt: Do not resolve deep imports for @vitest/ (4171a1076 )
  • kit: Initialize tsconfig paths in addTemplate if undefined (#30348 )
  • nuxt: Treat client useAsyncData calls as async boundaries (#30343 )
  • nuxt: Initialise import.meta.hot.data (b1cf5781d )

💅 Refactors

  • Move composable-keys plugin into nuxt core (#30029 )
  • nuxt: Simplify and improve core plugins that parse ast (#30088 )
  • nuxt: Prefix all core modules with nuxt: (#30028 )

📖 Documentation

  • Remove extra new line in frontmatter (#30031 )
  • Text capitalization for titles (#30054 )
  • Mention that type checking can happen in dev (#30012 )
  • Fix typos in punctuation (#30006 )
  • Remove duplicate information about preprocessor variables (#30002 )
  • Format text case for consistency (#30073 )
  • Add a section about event.waitUntil (#29583 )
  • Improve wording (#30106 )
  • Update configuration files format (#30087 )
  • Update links to vite.dev (#30111 )
  • Fix incorrect vite docs link (#30112 )
  • Add note about using bun runtime (#30019 )
  • Add giget limitation in nuxt layers documentation (#30122 )
  • Correct vite link (#30135 )
  • Add nuxi upgrade channel flag (#30184 )
  • Add note about awaiting useLazyFetch (#30171 )
  • Add missing comma in upgrade doc code sample (#30189 )
  • Added options and option definitions for sourcemap (#30201 )
  • Add shared directory documentation (#29816 )
  • Document vite.css.preprocessorMaxWorkers (eb1ba017c )
  • Handle zero-length string (cf74b4c98 )
  • Update nitro links + fix link checking (#30228 )
  • Add a note about compatibilityVersion feature flag (#30274 )
  • Update auto-imports to advertise the scan feature (#30292 )
  • Update nuxi command pages (#30199 )
  • Update migration documentation for inlineStyles (2660bffbc )
  • Add bluesky link (#30322 )
  • Add recipe for session and authentication (#27287 )
  • Fix filename for prerendering page (#30333 )
  • Add spacing (#30331 )

🏡 Chore

✅ Tests

  • Add additional attw test for built packages (#30206 )
  • Improve assertions for spa loading tests (80bd2d2ec )
  • Bump bundle size snapshot (d545f9e96 )
  • Try to improve spa preloader tests (08219a502 )
  • Ensure dev server is loaded before running tests (f66cf928e )

🤖 CI

  • Ignore dev-dependencies for engines.node (e366a6feb )
  • Analyse github actions with codeql (#30293 )
  • Exclude file that codeql cannot analyse (7e03b08a6 )

❤️ Contributors

Version v3.14.1592

Released on November 19, 2024

3.14.1592 is the next patch release.

👉 Changelog

compare changes

🩹 Fixes

  • rspack: Update webpackbar with support for rspack (#29823 )
  • nuxt: Assign default name to component without setup (#29869 )
  • kit: Use dst to deduplicate templates when adding them (#29895 )
  • nuxt: Handle empty plugin files (d44408e87 )
  • vite: Use resolved nuxt template dst to invalidate modules (6cd3352de )
  • nuxt: Return null map for empty plugin metadata (302a66da9 )
  • kit: Resolve module paths before appending subpaths (#29955 )
  • nuxt: Recompile templates on change events (#29954 )
  • nuxt: Do not include <NuxtWelcome> when building (#29956 )
  • nuxt: Allow scanning metadata from 2+ files at same path (#29969 )
  • nuxt: Do not disallow importing nitro dependencies (#29975 )

💅 Refactors

  • nuxt: Define layouts as async vue components (#29957 )

📖 Documentation

🏡 Chore

  • Remove unused imports and update eslint config (#29876 )

✅ Tests

🤖 CI

❤️ Contributors

Version v3.14.159

Released on November 6, 2024

3.14.159 is a hotfix release to address regressions in v3.14.

We're leaning into the π theme - future patch releases of this minor version will just continue adding digits. (Sorry for any inconvenience! 😆)

👉 Changelog

compare changes

🩹 Fixes

  • nuxt: Update nitropack preset directory (#29780 )
  • kit: Fall back to meta version if there's no module.json (#29793 )
  • kit: Use mlly to resolve module paths to avoid cjs fallback (#29799 )
  • webpack,rspack: Add adapter for webpack-dev-middleware (#29806 )
  • nuxt: Remove null-byte prefix for virtual files (#29809 )
  • kit: Convert module path to file url before reading meta (fb833ac64 )

📖 Documentation

  • Capitalize titles (#29768 )
  • Fix rou3 link in nitro.js (#29775 )
  • Fix tip formatting (#29792 )
  • Add link to h3 blogpost (#29794 )
  • Remove outdated cloudflare tip (auto minify deprecated) (#29812 )

🏡 Chore

  • nuxt: Remove redundant type (#29810 )

❤️ Contributors

Version v3.14.0

Released on November 4, 2024

3.14.0 is the next minor release.

👀 Highlights

Behind the scenes, a lot has been going on in preparation for the release of Nuxt v4 (particularly on the unjs side with preparations for Nitro v3!)

⚡️ Faster starts powered by jiti

Loading the nuxt config file, as well as modules and other build-time code, is now powered by jiti v2. You can see more about the release in the jiti v2 release notes , but one of the most important pieces is native node esm import (where possible), which should mean a faster start. ✨

📂 Shared folder for code and types shared with client/server

You should never import Vue app code in your nitro code (or the other way around). But this has meant a friction point when it comes to sharing types or utilities that don't rely on the nitro/vue contexts.

For this, we have a new shared/ folder (#28682 ). You can't import Vue or nitro code into files in this folder, but it produces auto-imports you can consume throughout the rest of your app.

If needed you can use the new #shared alias which points to this folder.

The shared folder is alongside your server/ folder. (If you're using compatibilityVersion: 4, this means it's not inside your app/ folder.)

🦀 rspack builder

We're excited to announce a new first-class Nuxt builder for rspack. It's still experimental but we've refactored the internal Nuxt virtual file system to use unplugin to make this possible.

Let us know if you like it - and feel free to raise any issues you experience with it.

👉 To try it out, you can use this starter - or just install @nuxt/rspack-builder and set builder: 'rspack' in your nuxt config file.

✨ New composables

We have new useResponseHeader and useRuntimeHook composables (#27131 and #29741 ).

🔧 New module utilities

We now have a new addServerTemplate utility (#29320 ) for adding virtual files for access inside nitro runtime routes.

🚧 v4 changes

We've merged some changes which only take effect with compatibilityVersion: 4, but which you can opt-into earlier.

  1. previously, if you had a component like ~/components/App/Header.vue this would be visible in your devtools as <Header>. From v4 we ensure this is <AppHeader>, but it's opt-in to avoid breaking any manual <KeepAlive> you might have implemented. (#28745 ).
  2. Nuxt scans page metadata from your files, before calling pages:extend. But this has led to some confusing behaviour, as pages added at this point do not end up having their page metadata respected. So we now do not scan metadata before calling pages:extend. Instead, we have a new pages:resolved hook, which is called after pages:extend, after all pages have been augmented with their metadata. I'd recommend opting into this by setting experimental.scanPageMeta to after-resolve, as it solves a number of bugs.

🗺️ Roadmap to v3.15

They didn't quite make it in time for v3.14 but for the next minor release you can expect (among other things):

  • auto-imported directives from modules (#29203 )
  • 'isolated' page renders (#29366 )
  • delayed hydration (#26468 )

✅ 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

  • deps: Upgrade to latest version of jiti (#27995 )
  • kit,nuxt,vite,webpack: Reimplement cjs utils using jiti (#29073 )
  • nuxt: Normalise component names to match nuxt pattern (#28745 )
  • kit,schema: Add addServerTemplate utility (#29320 )
  • nuxt: Add useResponseHeader composable (#27131 )
  • rspack,webpack: Add rspack builder (#29142 )
  • nuxt,schema: pages:resolved hook + scan meta post extend (#28861 )
  • nuxt: Allow enabling route props in definePageMeta (#29586 )
  • schema,nuxt: Add shared/ folder and #shared alias (#28682 )
  • nuxt: Allow chunk error or manifest update -> reload (#28160 )
  • nuxt: Add useRuntimeHook composable (#29741 )

🔥 Performance

  • nuxt: Remove unneeded second call to useNuxtApp (#29514 )
  • vite: Avoid redundant postcss plugins overwrite (#29619 )
  • kit,nuxt,vite,webpack: Hoist regex patterns (#29620 )

🩹 Fixes

  • nuxt: Simplify plugin InjectionType template conditional (#29023 )
  • nuxt: Access server build from webpack memfs (#29027 )
  • nuxt: Do not resolve non-absolute component paths (#29036 )
  • nuxt: Defer unsetting error handler until suspense resolves (#29037 )
  • nuxt: Pass DOMException as fetch abort exception (#29058 )
  • vite: Don't force protocol if disabled devServer.https (#29049 )
  • nuxt: Empty nitro buildDir in dev mode (#29068 )
  • nuxt: Don't resolve relative import type paths for deps (#29069 )
  • kit: Handle passing 'bare' relative paths to modules (c7fecd8a1 )
  • kit: Try resolving module path from each node_modules dir (70a622d43 )
  • kit,vite,webpack: Resolve postcss paths from each modules dir (#29096 )
  • kit,vite,webpack: Strip node_modules/ from parent urls (5bd42c893 )
  • nuxt: Add crossorigin attribute for stylesheets (#29138 )
  • nuxt: Use routeRules to hint pages to prerender (#29172 )
  • nuxt: Pass absolute external link urls to link:prefetch (#29321 )
  • nuxt: Error on build when required module is missing (#29287 )
  • nuxt: Prevent 404 when hitting component test endpoint (cb725f014 )
  • nuxt: Avoid throwing 404 error before middleware finishes (#29054 )
  • schema: Use ConfigLayer type from c12 (#29370 )
  • nuxt: Fix nested page types in typedPages (#29352 )
  • nuxt: Allow islands to manipulate head client-side (#29186 )
  • vite: Dim repeat count in logs (#29392 )
  • schema: Mark configFile as required in layer type (3bbcd7d21 )
  • nuxt: Remove vue compiler hints from auto import (#29713 )
  • vite: Update signature for createIsExternal (686be8168 )
  • nuxt: Respect existing props value in definePageMeta (#29683 )
  • schema: Hoist nitropack/types to ensure api routes are typed (54096875e )

💅 Refactors

  • nuxt: Use addBuildPlugin internally (#29157 )
  • nuxt,schema,vite,webpack: Use unplugin for vfs (#29165 )

📖 Documentation

  • Use defineNuxtComponent instead of defineComponent (#29011 )
  • Remove duotone icons for clarity (#29040 )
  • Fix typo (#29045 )
  • Remove specific Nuxt 4 release date (#29151 )
  • Remove redundant newlines and indentations (#29190 )
  • Add links to short videos from daniel (#29185 )
  • Fix comments typo in auto-imports example (#29195 )
  • Add missing word (#29230 )
  • Add a section about useRequestFetch and event.$fetch (#29099 )
  • Add example of typing custom useFetch errors (#29253 )
  • Ensure manifest code snippet works with pnpm (#29273 )
  • Consistent directory structure (#29292 )
  • Update to new ofetch headers for interceptors (#29118 )
  • Mention upgrading third-party configs (#27768 )
  • Improve explanation of ssr + data fetching (#29010 )
  • Add a description for .env.test (#29398 )
  • Add section on 'updateAppConfig' in the 'app.config' page (#29397 )
  • Add example to navigateTo util (#29611 )
  • Remove mockImplementation() call (#29669 )
  • Update lifecycle hooks (#29678 )
  • Type cast api plugin in custom usefetch example (#29756 )
  • Correct some errors about proxying headers with $fetch (#29755 )
  • Add information on --envName flag (#28909 )
  • Add error expectation (09885b87e )

📦 Build

🏡 Chore

✅ Tests

🤖 CI

❤️ Contributors

Version v3.13.2

Released on September 15, 2024

3.13.2 is the next 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

compare changes

🔥 Performance

  • nuxt: Remove interop default for dynamic components (#28912 )

🩹 Fixes

  • nuxt: Fix ssr log querySelector (#28864 )
  • schema: Enable propsDestructure by default (#28830 )
  • nuxt: Ensure injected route has enumerable keys (#28841 )
  • nuxt: Don't override vue instance with legacy asyncData (#28842 )
  • nuxt: Render server errors with ssr: false (#28834 )
  • nuxt: Resolve full component paths (#28843 )
  • nuxt: Improve accuracy of module resolution conditions (#28846 )
  • nuxt: Log more context of prerendering errors (#28895 )
  • nuxt: Enable injectAtEnd to reduce circular auto-imports (#28822 )
  • nuxt: Ensure we process files in buildDir for unimport (#28899 )
  • nuxt: Do not accept attrs on <NuxtErrorBoundary> (#28901 )
  • nuxt,schema: Accept any module in inline modules array (#28922 )
  • nuxt: Fall back to original component filePath (#28925 )
  • nuxt: Make runWithContext generic (#28926 )
  • nuxt: Set inheritAttrs: false for fragment components (#28939 )
  • nuxt: Use case-insensitive regexp for <script> blocks (4fd24381c )
  • nuxt: Ensure component imports are injected last (#28944 )
  • nuxt: Catch chunk errors directly in navigation (820908696 )
  • nuxt: Add missing isNuxtMajorVersion export (#29016 )
  • nuxt: Correct type for useError (#28996 )

💅 Refactors

  • nuxt: Use vite:preloadError event (#28862 )

📖 Documentation

  • Add known limitations for app.config.ts (#28875 )
  • Typo fixed missing closing angle bracket (#28880 )
  • Update useFetch troubleshooting section (#28918 )
  • Capitalize text (#28972 )
  • Fix typo (#28983 )
  • Add clarity to useFetch parameter signature (#28993 )
  • Remove confusing reference to 'SPA' (#28991 )

🏡 Chore

  • Use consola to log out compatibility info (#28854 )
  • vite: Use correct type import (3f508d521 )
  • Enable noUncheckedSideEffectImports (#28903 )
  • Add pending triage to blank issues (#28923 )
  • Correct comment style (c4181b5a2 )
  • Fix typos (462380d45 )
  • Refresh lockfile, use htmlnano + pin workflow deps (#28946 )
  • Pin dep + workflow by hash (4d81334c9 )
  • ui-templates: Use class-selector (043329f52 )

✅ Tests

  • Collect bundle sizes in parallel (1ce81069d )
  • Add regression test for using route in template (#28967 )
  • Convert set to array (6ee3b3adc )
  • Switch inline snapshot to object comparison (ae5135363 )

🤖 CI

  • Access issue number from payload (8e4585c14 )
  • Configure codeql to ignore tests (d5f98a757 )
  • Add default permissions for workflows (3ede01cd4 )
  • Scan source files with codeql (#28943 )
  • Skip setting up node before codeql scan (c4d7c92e9 )

❤️ Contributors

Version v3.13.1

Released on September 4, 2024

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.

  1. 🆔 useId now uses a built-in Vue composable for stable ids between server + client! #28285
  2. 🔥 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

compare changes

🔥 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 from useRoute() (#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

❤️ Contributors

Version v3.13.0

Released on August 22, 2024

👀 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:

Directory structure
-| 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:

pages/index.vue
<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:

nuxt.config.ts
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:

nuxt.config.ts
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 ):

declarations.d.ts
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

compare changes

🚀 Enhancements

  • nuxt: Await custom routes function in router.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 to addRouteMiddleware (#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 )
  • Fix spaces (#28233 )
  • Add vue lang to sample code (#28247 )
  • Use splitSetCookieString from cookie-es (29f95ae0d )
  • Use headers.getSetCookie (45c6df9a4 )
  • Fix codemod command typos (#28279 )
  • bunx -> bun x (#28277 )
  • Add missing comma to example (#28300 )
  • Add language to example schema codeblock (#28294 )
  • Update link to RuntimeNuxtHooks (#28336 )
  • Update links to social media (cd5195047 )
  • Setup host property and usage example (#28331 )
  • Fix TypeScript errors for examples (#28403 )
  • Improve readability of link to mdn (#28327 )
  • Use ts for create-error example (#28411 )
  • Alias links in jsdoc @see blocks (#28270 )
  • Link to vue test utils docs for mountSuspended (#28463 )
  • Remove vue-tsc major version constraint (#28484 )
  • Recommend '#teleports' target instead of 'body' (#28489 )
  • Correct custom routing link (#28497 )
  • Improve typing of default exports (#28520 )
  • Fix options type in custom useFetch recipe (#28389 )
  • Update useRuntimeConfig source path (#28553 )
  • Add line-breaks to tips in Module Author Guide (#28587 )
  • Update nuxt scripts status (#28629 )

🏡 Chore

✅ Tests

  • Disable pageTransition in client-only page (#27839 )
  • Ignore SharedComponent in server head (510f3e28f )
  • Update bundle size (3ecb95a7c )

🤖 CI

  • Add reproduire-sur-stackblitz workflow (#28531 )

❤️ Contributors

Version v3.12.4

Released on July 18, 2024

3.12.4 is the next regularly scheduled patch release.

👉 Changelog

compare changes

🔥 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 returns string (#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/ as srcDir 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

  • Run prepare step before linting docs (f8fbefb42 )
  • Run prepare step before linting docs (d629b82b3 )

❤️ Contributors

Version v3.12.3

Released on July 2, 2024

3.12.3 is the next regularly scheduled patch release.

👉 Changelog

compare changes

🔥 Performance

  • nuxt,vite: Use native fs utils rather than fs-extra (#27787 )
  • schema: Use chokidar when a custom srcDir 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 with open (#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 on useCookie 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 or Nuxt 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 refs (#27933 )
  • Mention layers in directory guide (c222fe7aa )

🏡 Chore

✅ 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

Version v3.12.2

Released on June 16, 2024

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

compare changes

🔥 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 with app.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

✅ Tests

  • Add type test for nuxt module resolved types (115fc2d18 )

🤖 CI

❤️ Contributors

Version v3.12.1

Released on June 11, 2024

3.12.1 is a hotfix release to address a typo in the nuxt/script stub auto-imports.

👉 Changelog

compare changes

🩹 Fixes

  • nuxt: Update registry list for @nuxt/scripts (0252000d7 )

💅 Refactors

  • schema: Use CompatibilityDateSpec (#27521 )

📖 Documentation

  • Update more references to v3.12 (1d2eee00d )
  • Mention 3.12 for testing nuxt 4 (#27525 )

🏡 Chore

✅ Tests

❤️ Contributors

Version v3.12.0

Released on June 11, 2024

👀 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 plugin
  • experimental.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 )
  • 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 and updateRuntimeConfig utils (#27117 )
  • schema: Remove some experimental options for v4 (#27132 )
  • nuxt: Auto-register layers in layers/ directory (#27221 )
  • nuxt: Allow displaying error state in loading indicator (#27176 )
  • nuxt,schema: Add appId and improve chunk determinism (#27258 )
  • nuxt: Check schema/kit versions when loading nuxt (#27224 )
  • schema: Add experimental multiApp flag (#27291 )
  • nuxt: Respect defaults when clearing asyncData (#27295 )
  • nuxt: Display banner when run with compatibilityVersion (#27305 )
  • nuxt: Add URL serialiser for dev server logs (a549b46e9 )
  • nuxt: Handle nuxt route injection for this.$route (#27313 )
  • nuxt: Allow configuring interval for checking app update (#27324 )
  • nuxt: Warn when accessing private runtimeConfig on client (#26441 )
  • kit: Support typed module options in installModule (#26744 )
  • kit,schema: Add .with for better module options types (#26850 )
  • nuxt: Register plugin hooks before executing plugins (#27449 )
  • nuxt,schema: Add compatibilityDate flag for future (#27512 )

🔥 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 )
  • nuxt: useState in NuxtClientFallback setup function (#26928 )
  • nuxt: Compile plugin templates last (#27009 )
  • nuxt: Register redirect middleware before pushing route (#27016 )
  • nuxt,schema: Remove .js extension from template imports (0d4a622f3 )
  • nuxt: Don't overwrite existing scope in runWithContext (#26976 )
  • schema: Use v3 folder structure if app.vue exists in rootDir (1af81ed0f )
  • nuxt: Use resolved path for test component import (8e793ad5c )
  • nuxt: Use URL constructor to resolve external protocols (5f0693a69 )
  • nuxt: Use URL for parsing URLs rather than parseURL (ea22d3f98 )
  • nuxt: Deprecate process.* flags (#27089 )
  • nuxt: Provide default url for URL constructor (8bdd620ba )
  • nuxt: Preload links with same hostname (c065505e1 )
  • nuxt: Remove unused prop in NuxtTeleportIslandComponent (#27093 )
  • nuxt: Don't pass options to spaLoadingTemplate function (0e12b6eb8 )
  • nuxt: Scan folder indices for middleware (#27187 )
  • nuxt: Pass path to jiti and not file URL (#27252 )
  • schema: Hoist `@nuxt/devtools types for config auto-completion (008a26417 )
  • nuxt: Correct components dir regexp (dad89c2b1 )
  • schema: Handle dev/test buildId in schema (#27274 )
  • nuxt: Encode location header in navigateTo (#27280 )
  • nuxt: Invert version check (e5649613c )
  • nuxt: Exempt equality check for kit/schema version (a531e6f46 )
  • nuxt: Use undefined rather than null for data fetching defaults (#27294 )
  • vite: Ignore query/hash when resolving public assets (#27306 )
  • nuxt: Clear timeout when asyncData request finishes/aborts (#27308 )
  • nuxt: Provide default data type values in nuxt/app dir (#27314 )
  • nuxt: Add module declarations for virtual files (#27311 )
  • nuxt: Respect app.cdnURL for extracted payloads (#26668 )
  • vite: Handle runtime paths in inlined styles (#27327 )
  • nuxt: Add VNode reviver & don't deduplicate dev logs (#27309 )
  • vite: Suppress warning about unresolved public assets (#27328 )
  • nuxt: Defer shared asyncData promises to next tick (#27329 )
  • nuxt: Resolve modules from layers directories (#27338 )
  • schema: Pass correct jsx config for esbuild-loader (#27341 )
  • nuxt: Transpile app.config files in nitro build (#27342 )
  • nuxt: Use relative paths in app.config.d.ts (#27350 )
  • vite: Disable optimizeDeps in ssr (#27356 )
  • vite: Don't get available port when hmr.server is set (#27326 )
  • nuxt: Mark nuxt/scripts stubs as lower priority (51740fa1d )
  • nuxt: Handle errors loading app manifest (#27441 )
  • schema: Exclude non-serialisable types from app options (#27478 )
  • nuxt: Deduplicate app.head arrays (#27480 )
  • kit: Improve defaults in generated tsconfig.json (#27485 )
  • nuxt: Use buildAssetsDir in island teleport dev chunk (#27469 )
  • kit: Do not use module: preserve unelss ts v5.4 is installed (b08dfc98b )
  • nuxt: Ensure payload script executes before entry (#27506 )
  • kit: Avoid fallback to normalized path in module loading (#27507 )
  • nuxt: Also augment page metadata after pages:extend hook (#27134 )
  • nuxt: Resolve full path to app manifest stub page (91685a5b2 )
  • nuxt: Resolve paths without file extensions (dccf2e5f3 )
  • kit: Revert back to esnext target (7bb02735e )
  • kit,schema: Revert changes to module options types (#26850 )
  • nuxt: Remove boolean value for dedupe in v4 compat (#27511 )
  • nuxt: Add parent scopeId to server components (#27497 )
  • nuxt: Handle symbol keys in wrapped runtime config (13fec55c1 )
  • nuxt: Register augmented pages to avoid re-augmenting (b75bf870b )
  • nuxt: Use file path as key for re-augmenting (09f6a88e1 )

💅 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 )
  • Add @vue/test-utils getting started guide (#26205 )
  • Add a note about HTTPS with a self-signed certificates (#26481 )
  • Clarify purpose of play online section (#25978 )
  • Fix typo with a -> an (#26856 )
  • Fix code block formatting (#26859 )
  • Add more detail to usePreviewMode explanation (#26602 )
  • Fix import of defineConfig (a60de743a )
  • Add @since annotations to exported functions (#25365 )
  • Add watch example link (#26818 )
  • Add source tag (#26884 )
  • Update strict checks section with new default (#26965 )
  • Correct link to data fetching docs (#26988 )
  • Add link to one of @manniL 's videos on layers (#26984 )
  • Fix small typo (#26999 )
  • Preprocessors as dev deps to align with vue plugin (#27005 )
  • Change .eslintrc.js to eslint.config.js (#27020 )
  • Add docs for future.compatibilityVersion (e7789a257 )
  • Add vite plugin recipe (#27043 )
  • Improve data fetching wording and explanation (#27061 )
  • Add missing options for nuxi init (#27051 )
  • Update docs for ignorePrefix to clarify ignored files (#27065 )
  • Mention nightly release channel for unreleased features (8fcf893f8 )
  • Add migration/testing guide for nuxt 4 (#27128 )
  • Improve testing component examples (#27138 )
  • Fix type checking of component testing blocks (b5e35e3bd )
  • Add app.config.ts to nuxt 4 testing/migration (#27164 )
  • Add video links for more context (#27174 )
  • Add module execution order (#27178 )
  • Mark bridge as stable (#27212 )
  • Explain how environment variables work in production (#27189 )
  • Add cache option to useFetch params (#27225 )
  • Add custom useFetch recipe (#27208 )
  • Add nuxt/scripts (#27229 )
  • Add example of passing params to <NuxtLink> (#27284 )
  • Add additional example for setting baseURL and cdnURL (#27273 )
  • Update readme for Nuxt 2 NES and support (d35e9cd3f )
  • Introduce hint and link to environment override feature (#27315 )
  • Document partitioned attribute of useCookie (#27297 )
  • Add windows git clone symlink tip (#27332 )
  • Fix release badges (#27355 )
  • Fix list spacing (#27366 )
  • Capitalize text (#27348 )
  • Added recipe for consuming SSE via POST request (#27422 )
  • Add deployment advice for client-side rendering (#27426 )
  • Add external parameter behavior navigateTo (#27472 )
  • Add note about middleware re-running for error pages (#27481 )
  • Update link to nitro error hook type (61766702c )
  • Add comment about existing custom srcDir in upgrade steps (3383a2df2 )
  • Add docs page for prerendering (#27286 )

📦 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

✅ 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

Version v3.11.2

Released on April 4, 2024

3.11.2 is the next regularly scheduled patch release.

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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

🔥 Performance

  • nuxt: Don't tree-shake useServerHead in dev (#26421 )
  • nuxt: Reduce nuxt island payload (#26569 )
  • nuxt: Unsubscribe from watch when scope is disposed (#26554 )
  • nuxt: Reduce router resolutions (#26519 )

🩹 Fixes

  • nuxt: Handle underscores in island names (#26370 )
  • nuxt: Don't append new route for redirect if one exists (#26368 )
  • nuxt: Ignore navigateTo open option on server side (#26392 )
  • nuxt: Print errors when compiling templates (#26410 )
  • nuxt: Don't warn about definePageMeta in server pages (#26422 )
  • nuxt: Pass joinRelativeURL + share paths on server (#26407 )
  • nuxt: Exclude <srcDir>/index.html from import protection (#26430 )
  • nuxt: Early return from refreshCookie on server (22ada37b4 )
  • nuxt: Move v-if to wrapper in islands transform (#26386 )
  • nuxt: Move directives to client component island wrapper (#26387 )
  • nuxt: Ignore fetch errors in getLatestManifest (#26486 )
  • nuxt: Check island element instead of hydration state (#26480 )
  • nuxt: Add build id to rendered payload url (#26504 )
  • nuxt: Support serialising rich server logs (#26503 )
  • nuxt: Handle errors parsing/stringifying logs (4a87c35df )
  • nuxt: Augment GlobalComponents in multiple vue modules (#26541 )
  • nuxt: Suppress warning about resolve cache-driver (#26595 )
  • nuxt: Handle auto-importing named components (#26556 )
  • schema: Update webpack transformAssetUrls + pass hoistStatic to vite plugin (#26563 )
  • schema: Document use case for typescript.shim (#26607 )
  • nuxt: Normalise rollup opts in island transform w/o nuxt (#26589 )
  • nuxt: Handle missing Nuxt context in useRoute (#26633 )

💅 Refactors

  • nuxt: Remove duplicated check (#26544 )
  • nuxt: Simplify check in navigateTo for server (#26546 )
  • nuxt: Simplify runtimeConfig initialization of client side (#26558 )

📖 Documentation

  • Update information about playwright test runner (8e635fd23 )
  • Add info about dependencies to install (a258bfc34 )
  • Add missing end block (f55f74798 )
  • Migration page typo (#26389 )
  • Advise installing nuxi for debugging with pnpm (#26447 )
  • Warn about single root element for server components (#26462 )
  • Adjust grammar (#26482 )
  • Add contents of the layout in examples (#26532 )
  • Add note about prerenderRoutes in dynamic routes (#26547 )
  • Clarify app-config merging strategy note (#26564 )
  • Update core modules roadmap (#26553 )
  • Replace process.* with import.meta.* (#26611 )
  • Correct grammar in typescript.shim JSDoc (#26626 )
  • Add missing comma (#26644 )

🏡 Chore

❤️ Contributors

Version v3.11.1

Released on March 18, 2024

3.11.1 is a patch release addressing regressions in v3.11.0.

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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

🩹 Fixes

  • nuxt: Ignore console.logs called outside event context (b3ced3d69 )
  • schema: Include ofetch in typescript.hoist defaults (#26316 )
  • nuxt: Conditionally use tsx parser (#26314 )
  • nuxt: Correct finish types and add to docs (0d9c63b82 )
  • nuxt: Ignore failures to access asyncContext in environments without it (523db1a19 )
  • nuxt: Handle failure creating BroadcastChannel (#26340 )
  • nuxt: Don't warn when injecting client-only components (#26341 )
  • nuxt: Prevent losing pages routes on prerender (#26354 )
  • nuxt: Pass undefined name when resolving trailing slash (#26358 )
  • vite: Use ssr result if it exists (#26356 )

📖 Documentation

  • Fix code block formatting for usePreviewMode (#26303 )
  • Fix confusing wording (#26301 )
  • Add note that useId must be used with single root element (401370b3a )
  • Mention <DevOnly> component in api section (#26029 )
  • Note that @nuxt/schema should be used by module authors (#26190 )
  • Add routeNameSplitter example in migration docs (#25838 )

🏡 Chore

  • nuxt: Remove unused code (#26319 )
  • Revert update github/codeql-action action (c72951b06 )

🤖 CI

  • Configure npm registry in release workflow (68f7d4df8 )

❤️ Contributors

Version v3.11.0

Released on March 17, 2024

👀 Highlights

This is possibly the last minor release before Nuxt v4, and so we've packed it full of features and improvements we hope will delight you! ✨

🪵 Better logging

When developing a Nuxt application and using console.log in your application, you may have noticed that these logs are not displayed in your browser console when refreshing the page (during server-side rendering). This can be frustrating, as it makes it difficult to debug your application. This is now a thing of the past!

Now, when you have server logs associated with a request, they will be bundled up and passed to the client and displayed in your browser console. Asynchronous context is used to track and associate these logs with the request that triggered them. (#25936 ).

For example, this code:

pages/index.vue
<script setup>
console.log('Log from index page')

const { data } = await useAsyncData(() => {
  console.log('Log inside useAsyncData')
  return $fetch('/api/test')
})
</script>

will now log to your browser console when you refresh the page:

Log from index page
[ssr] Log inside useAsyncData 
    at pages/index.vue

👉 We also plan to support streaming of subsequent logs to the Nuxt DevTools in future.

We've also added a dev:ssr-logs hook (both in Nuxt and Nitro) which is called on server and client, allowing you to handle them yourself if you want to.

If you encounter any issues with this, it is possible to disable them - or prevent them from logging to your browser console.

nuxt.config.ts
export default defineNuxtConfig({
  features: {
    devLogs: false
    // or 'silent' to allow you to handle yourself with `dev:ssr-logs` hook
  },
})

🎨 Preview mode

A new usePreviewMode composable aims to make it simple to use preview mode in your Nuxt app.

plugins/test.client.ts
const { enabled, state } = usePreviewMode()

When preview mode is enabled, all your data fetching composables, like useAsyncData and useFetch will rerun, meaning any cached data in the payload will be bypassed.

Read more in the docs .

💰 Cache-busting payloads

We now automatically cache-bust your payloads if you haven't disabled Nuxt's app manifest, meaning you shouldn't be stuck with outdated data after a deployment.

👮‍♂️ Middleware routeRules

It's now possible to define middleware for page paths within the Vue app part of your application (that is, not your Nitro routes) (#25841 ).

nuxt.config.ts
export default defineNuxtConfig({
  routeRules: {
    '/admin/**': {
      // or appMiddleware: 'auth'
      appMiddleware: ['auth']
    },
    '/admin/login': {
      // You can 'turn off' middleware that would otherwise run for a page
      appMiddleware: {
        auth: false
      }
    },
  },
})

⌫ New clear data fetching utility

Now, useAsyncData and useFetch expose a clear utility. This is a function that can be used to set data to undefined, set error to null, set pending to false, set status to idle, and mark any currently pending requests as cancelled. (#26259 )

<script setup lang="ts">
const { data, clear } = await useFetch('/api/test')

const route = useRoute()
watch(() => route.path, (path) => {
  if (path === '/') clear()
})
</script>

🕳️ New #teleports target

Nuxt now includes a new <div id="teleports"></div> element in your app within your <body> tag. It supports server-side teleports, meaning you can do this safely on the server:

<template>
  <Teleport to="#teleports">
    <span>
      Something
    </span>
  </Teleport>
</template>

🚦 Loading indicator and transition controls

It's now possible to set custom timings for hiding the loading indicator, and forcing the finish() method if needed (#25932 ).

There's also a new page:view-transition:start hook for hooking into the View Transitions API (#26045 ) if you have that feature enabled.

🛍️ Server- and client-only pages

This release sees server- and client-only pages land in Nuxt! You can now add a .server.vue or .client.vue suffix to a page to get automatic handling of it.

Client-only pages will render entirely on the client-side, and skip server-rendering entirely, just as if the entire page was wrapped in <ClientOnly>. Use this responsibly. The flash of load on the client-side can be a bad user experience so make sure you really need to avoid server-side loading. Also consider using <ClientOnly> with a fallback slot to render a skeleton loader (#25037 ).

⚗️ Server-only pages are even more useful because they enable you to integrate fully-server rendered HTML within client-side navigation. They will even be prefetched when links to them are in the viewport - so you will get instantaneous loading (#24954 ).

🤠 Server component bonanza

When you are using server components, you can now use the nuxt-client attribute anywhere within your tree (#25479 ).

export default defineNuxtConfig({
  experimental: {
    componentIslands: {
      selectiveClient: 'deep'
    }
  },
})

You can listen to an @error event from server components that will be triggered if there is any issue loading the component (#25798 ).

Finally, server-only components are now smartly enabled when you have a server-only component or a server-only page within your project or any of its layers (#26223 ).

!WARNING
Server components remain experimental and their API may change, so be careful before depending on implementation details.

🔥 Performance improvements

We've shipped a number of performance improvements, including only updating changed virtual templates (#26250 ), using a 'layered' prerender cache (#26104 ) that falls back to filesystem instead of keeping everything in memory when prerendering - and lots of other examples.

📂 Public assets handling

We have shipped a reimplementation of Vite's public asset handling, meaning that public assets in your public/ directory or your layer directories are now resolved entirely by Nuxt (#26163 ), so if you have added nitro.publicAssets directories with a custom prefix, these will now work.

📦 Chunk naming

We have changed the default _nuxt/[name].[hash].js file name pattern for your JS chunks. Now, we default to _nuxt/[hash].js. This is to avoid false positives by ad blockers triggering off your component or chunk names, which can be a very difficult issue to debug. (#26203 )

You can easily configure this to revert to previous behaviour if you wish:

export default defineNuxtConfig({
  vite: {
    $client: {
      build: {
        rollupOptions: {
          output: {
            chunkFileNames: '_nuxt/[name].[hash].js',
            entryFileNames: '_nuxt/[name].[hash].js'
          }
        }
      }
    }
  },
})

💪 Type fixes

Previously users with shamefully-hoist=false may have encountered issues with types not being resolved or working correctly. You may also have encountered problems with excessive type instantiation.

We now try to tell TypeScript about certain key types so they can be resolved even if deeply nested (#26158 ).

There are a whole raft of other type fixes, including some regarding import types (#26218 and #25965 ) and module typings (#25548 ).

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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: Server-only pages (#24954 )
  • nuxt: Client-only pages (#25037 )
  • nuxt: Allow using nuxt-client in all components (#25479 )
  • nuxt: Add page:view-transition:start hook (#26045 )
  • nuxt: Custom loading reset/hide delay + force finish() (#25932 )
  • nuxt: Emit error if <NuxtIsland> can't fetch island (#25798 )
  • nuxt: usePreviewMode composable (#21705 )
  • nuxt: Support async transforms for data composables (#26154 )
  • nuxt: Add dedicated #teleports element for ssr teleports (#25043 )
  • nuxt: Enable islands if server pages/components present (#26223 )
  • nuxt: Allow generating metadata for nuxt components (#26204 )
  • vite: Handle multiple/custom public dirs (#26163 )
  • schema: Allow configuring type hoists with typescript.hoist (85166cced )
  • nuxt: Pass nuxt instance to getCachedData (#26287 )
  • nuxt: Pass server logs to client (#25936 )
  • nuxt: Add nuxtMiddleware route rule (#25841 )
  • nuxt: Add clear utility to useAsyncData/useFetch (#26259 )

🔥 Performance

  • Early return chained functions with falsy values (#25647 )
  • nuxt: Don't check isPrerendered in dev for server page (#26061 )
  • nuxt: Use fallthrough cache for prerender (#26104 )
  • nuxt: Tree shake island renderer (8323220f7 )
  • nuxt: Skip adding selective-client code if not enabled (#26176 )
  • nuxt: Use faster approach to check cache exists (#26172 )
  • nuxt: Only update changed templates (#26250 )

🩹 Fixes

  • kit: Apply nuxt types to .config/nuxt.config (5440ecece )
  • kit: Widen pattern to .config/nuxt.* (7815aa534 )
  • nuxt: Align error in showError/createError with h3 (#25945 )
  • kit: Don't warn if middleware is added twice (08b656a04 )
  • nuxt: Don't try to strip directory file extensions (#25965 )
  • nuxt: Produce valid css selector from useId (#25969 )
  • schema: Add vueCompilerOptions property to tsConfig (#25924 )
  • nuxt: Skip vue style blocks in unctx transform (#26059 )
  • nuxt: Pass event to useRuntimeConfig in Nuxt renderer (#26058 )
  • schema: Disable typescript.shim in favour of volar (#26052 )
  • nuxt: Only check if server page is prerendered on client (#26081 )
  • nuxt: Don't refetch server components in initial html (#26089 )
  • nuxt: Resolve defu/h3 paths in type templates (#26085 )
  • nuxt: Use exported toExports from unimport (#26086 )
  • nuxt: Cache-bust payloads with build id (#26068 )
  • nuxt: Export AsyncDataRequestStatus type (#26023 )
  • nuxt: Add space before <html> and <body> attrs (#26027 )
  • kit: Resolve module node_modules for modulesDir (#25548 )
  • nuxt: Handle external redirects from routeRules (#26120 )
  • nuxt: Use flat cache directory for prerender data (47cdd7dd0 )
  • nuxt: Watch custom cookieRef values deeply (#26151 )
  • nuxt: Access prerender cache synchronously (#26146 )
  • nuxt: Provide typescript aliases for core packages (#26158 )
  • nuxt: Handle errors resolving package paths (63bfaac12 )
  • kit: Handle errors resolving module path (3782ac0a2 )
  • nuxt: Clone paths to prevent shared object (264bf9833 )
  • nuxt: Detect component usage within ssrRender (#26162 )
  • nuxt: Improved plugin annotating warnings (#26193 )
  • nuxt: Generate typed routes after pages are scanned (#26206 )
  • nuxt: Only strip supported extensions when generating import types (#26218 )
  • nuxt: Init payload when using islands with ssr: false (f080c426a )
  • nuxt: Register/scan plugins with jsx/tsx extensions (#26230 )
  • nuxt: Update auto imports after other templates (#26249 )
  • nuxt: Respect baseUrl within server components (#25727 )
  • nuxt: Access shared asyncData state with useNuxtData (#22277 )
  • vite: Explicitly import publicAssetsURL (9d08cdfd1 )
  • nuxt: Don't ignore any files from buildAssetsDir (81933dfc3 )
  • vite: Drop name prefix for client chunk file names (#26203 )
  • kit: Clone middleware when adding to app (5be9253cf )
  • nuxt: Don't generate separate chunk for stubs (#26291 )
  • nuxt: Use joinRelativeURL for build assets (#26282 )
  • schema: Allow passing deep to selectiveClient (357f8db41 )
  • schema: Don't hoist types for consola for now (adbd53a25 )
  • nuxt: Guard window access more carefully (977377777 )
  • nuxt: Provide appMiddleware types with universal router (87c0678f9 )
  • nuxt: Handle nightly releases for hoisted types (3c7e68c84 )

💅 Refactors

  • nuxt: Simplify request computation (#26191 )
  • nuxt: Rename nuxtMiddleware to appMiddleware (cac745470 )
  • nuxt: Use addTypeTemplate for page augmentations (4925670dc )
  • nuxt: Use addTypeTemplate in more places (33ce71dd1 )

📖 Documentation

  • Mention when useId composable was introduced (#25953 )
  • Add domEnvironment option to testing example (#25972 )
  • Update VS Code settings (#25985 )
  • Mention island features are SFC only (#26013 )
  • Improve pick and transform doc (#26043 )
  • Fix 404 link (8e6d2306c )
  • Add Nuxt Fonts to changelog (#26077 )
  • Update roadmap (#26072 )
  • Document fallback prop for <NuxtLayout> (#26091 )
  • Add documentation for using layers with private repos (#26094 )
  • Remove twoslash from code sample (0bf70bd7a )
  • Update cssnano website url (d6edb30c5 )
  • Add warning about latest vue-tsc (#26083 )
  • Improve readme readability (#26118 )
  • Added bridge macros.pageMeta and typescript.esbuild option (#26136 )
  • Fix bracket escape on definePageMeta page (#26139 )
  • Add app:manifest:update hook (#26192 )
  • Add cache.varies docs for multi-tenant use case (#26197 )
  • Add mentions on Vue School tutorials (#25997 )
  • Update link to zhead (e889a7df5 )
  • Added modular architecture use case for Layers (#26240 )
  • Escape 'elements' in jsdoc comments (5c6dc4c14 )
  • Use a more common word (#26276 )
  • Split a sentence in two to improve readability (#26279 )
  • Removed unused composable example (#26283 )
  • Add more keywords for reducer/reviver docs (6b1f3438b )
  • Link to pinceau repo rather than website (#26286 )
  • Add link to ofetch repo (#26284 )
  • Improve section titles in error-handling docs (#26288 )
  • Add example for clear (24217a992 )
  • Add docs about playwright runner support (115298a44 )
  • Add some appMiddleware docs (da8e8eba8 )

🏡 Chore

✅ Tests

  • Use retryable assertion for scrollY (#26298 )
  • Also run composables test with appManifest off (205d0e2fa )
  • Remove wait for networkidle (9b5bffbbb )
  • Use locator assertion for body text (3d77e267d )
  • Use function assertion for second scrollY test (d981c056d )
  • Add type test for appMiddleware route rules (70669012f )

🤖 CI

  • Clean up pr cache when it is merged (#25873 )
  • Skip checking stackoverflow link (0a8c3444a )
  • Fix lychee configuration (375bd64c5 )
  • Run lint step after bundle test (c3c9c4b2a )
  • Release in ci when a v3 tag is pushed (c78c1161a )
  • Do not cache Playwright browsers (#26296 )

❤️ Contributors

Version v3.10.3

Released on February 22, 2024

3.10.3 is a regularly-scheduled patch release.

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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 vue and unjs ecosystems.

👉 Changelog

compare changes

🩹 Fixes

  • nuxt: Respect dedupe option in useFetch (#25815 )
  • nuxt: Bypass browser cache when fetching app build id (#25813 )
  • nuxt: In dev, don't link css files with ?inline query (#25822 )
  • nuxt: Pass external to navigate in custom <NuxtLink> (#25887 )
  • nuxt: Mark internal island components with @__PURE__ (#25842 )
  • nuxt: Use setTimeout before scrolling when navigating (#25817 )
  • nuxt: Add missing type for head in defineNuxtComponent (#25410 )
  • nuxt: Handle undefined paths in resolveTrailingSlashBehavior (ba6a4132b )
  • nuxt: Set to.name to be undefined rather than deleting entirely (4ca1ab7cf )

📖 Documentation

  • Enable more blocks for twoslash (#25830 )
  • Remove .ts extension when adding compiled files (#25855 )
  • Replace callout to new components (#25897 )
  • Fix incorrect wording (#25902 )

🏡 Chore

  • Use nuxt.config to enable pages for docs typecheck (72a2e23cc )
  • Restore environment back to development (3f92cf04d )
  • Unpin vite version 🙈 (d326e054d )
  • nuxt: Use Exclude rather than Omit (3fc4231d3 )

🤖 CI

  • Typecheck code samples in docs (#25777 )
  • Update link to stackblitz mcve page (59dd5fd93 )

❤️ Contributors

Version v3.10.2

Released on February 14, 2024

3.10.2 is a regularly-scheduled patch release.

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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 vue and unjs ecosystems.

👉 Changelog

compare changes

🩹 Fixes

  • nuxt: Export refreshCookie (#25635 )
  • nuxt: Allow prefetching urls with query string (#25658 )
  • nuxt: Remove undefined keys in route object (#25667 )
  • vite: Treat .pcss extension as a CSS extension (#25673 )
  • nuxt: Don't check for layout/page with <ClientOnly> (#25714 )
  • vite: Strip query strings for style chunk filenames (#25764 )
  • nuxt: Inline entry styles before component styles (#25749 )
  • vite: Optimise layer dependencies with vite (#25752 )
  • nuxt: Don't add extra baseURL on server useRequestURL (#25765 )
  • schema: Use rootDir, not process.cwd, for modulesDir (#25766 )
  • nuxt: Only warn for useId if attrs were not rendered (#25770 )
  • kit: Don't mutate existing component entry when overriding (#25786 )

📖 Documentation

  • Fix typo in useAsyncData docs (#25644 )
  • Add quotes to clarify what site title is in example (#25669 )
  • Enable twoslash for some code snippets (#25679 )
  • Add prepend option docs for addComponentsDir (#25683 )
  • Extend auto-scanned layer directories (#25720 )
  • Improve wording in seo docs (#25692 )
  • Add how to debug nuxt with node inspector (#25731 )
  • Add missing export defaults for nuxt config (#25774 )
  • Add import statement for mountSuspended (#25783 )
  • Pass event to useRuntimeConfig (#25788 )

🏡 Chore

  • schema: Add missing closing code block (#25641 )

❤️ Contributors

Version v3.10.1

Released on February 5, 2024

3.10.1 is a regularly-scheduled patch release.

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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 vue and unjs ecosystems.

👉 Changelog

compare changes

🔥 Performance

  • nuxt: Clear route meta build cache when pages change (#25514 )

🩹 Fixes

  • nuxt: Fix syntax error when serializing route meta (#25515 )
  • nuxt: Only request animation frame on client (#25569 )
  • schema: Correctly set value for app.viewTransition (#25581 )
  • nuxt: Correct return type of refresh functions (#25568 )
  • nuxt: Broadcast cookie change in correct format (#25598 )
  • nuxt: Generate typed route declarations when building (#25593 )
  • nuxt: Remove key from useId type signature (#25614 )
  • nuxt: Remove $ from generated id in useId (#25615 )
  • nuxt: Don't set default rel for same-site external links (#25600 )
  • nuxt: Warn if inheritAttrs: false when using useId (#25616 )
  • nuxt: Fetch non-server rendered islands when hydrating (#25613 )
  • nuxt: Don't check page/layout usage when redirecting (#25628 )

💅 Refactors

  • nuxt: Improve NuxtLink types (#25599 )

📖 Documentation

  • Correct typo (#25523 )
  • Add and link to a section on Nuxt context (#23546 )
  • Explain how to set <NuxtLink> defaults in nuxt config (#25610 )

🏡 Chore

  • Use pathe in internal tests (e33cec958 )
  • nuxt: Rename nuxt -> nuxtApp internally for consistency (c5d5932f5 )

🤖 CI

  • Fix playwright cache (#25527 )
  • Retry flaky test when running in Windows with Webpack (#25536 )
  • Retry flaky test when running in Windows with Webpack (#25543 )
  • Retry flaky test when using Webpack (#25550 )
  • Simplify label PR workflow (#25579 )

❤️ Contributors

Version v3.10.0

Released on January 30, 2024

3.10.0 is the next minor/feature release.

👀 Highlights

v3.10 comes quite close on the heels of v3.9, but it's packed with features and fixes. Here are a few highlights.

✨ Experimental shared asyncData when prerendering

When prerendering routes, we can end up refetching the same data over and over again. In Nuxt 2 it was possible to create a 'payload' which could be fetched once and then accessed in every page (and this is of course possible to do manually in Nuxt 3 - see this article ).

With #24894 , we are now able to do this automatically for you when prerendering. Your useAsyncData and useFetch calls will be deduplicated and cached between renders of your site.

nuxt.config.ts
export defineNuxtConfig({ 
  experimental: { 
    sharedPrerenderData: true
  } 
})

!IMPORTANT
It is particularly important to make sure that any unique key of your data is always resolvable to the same data. For example, if you are using useAsyncData to fetch data related to a particular page, you should provide a key that uniquely matches that data. (useFetch should do this automatically.)

👉 See full documentation .

🆔 SSR-safe accessible unique ID creation

We now ship a useId composable for generating SSR-safe unique IDs (#23368 ). This allows creating more accessible interfaces in your app. For example:

components/MyForm.vue
<script setup>
const emailId = useId()
const passwordId = useId()
</script>

<template>
  <form>
    <label :for="emailId">Email</label>
    <input
      :id="emailId"
      name="email"
      type="email"
    >
    <label :for="passwordId">Password</label>
    <input
      :id="passwordId"
      name="password"
      type="password"
    >
  </form>
</template>

✍️ Extending app/router.options

It's now possible for module authors to inject their own router.options files (#24922 ). The new pages:routerOptions hook allows module authors to do things like add custom scrollBehavior or add runtime augmenting of routes.

👉 See full documentation .

Client-side Node.js support

We now support (experimentally) polyfilling key Node.js built-ins (#25028 ), just as we already do via Nitro on the server when deploying to non-Node environments.

That means that, within your client-side code, you can import directly from Node built-ins (node: and node imports are supported). However, nothing is globally injected for you, to avoid increasing your bundle size unnecessarily. You can either import them where needed.

import { Buffer } from 'node:buffer'
import process from 'node:process'

Or provide your own polyfill, for example, inside a Nuxt plugin.

// ~/plugins/node.client.ts
import { Buffer } from 'node:buffer'
import process from 'node:process'

globalThis.Buffer = Buffer
globalThis.process = process

export default defineNuxtPlugin({})

This should make life easier for users who are working with libraries without proper browser support. However, because of the risk in increasing your bundle unnecessarily, we would strongly urge users to choose other alternatives if at all possible.

🍪 Better cookie reactivity

We now allow you to opt-in to using the CookieStore . If browser support is present, this will then be used instead of a BroadcastChannel to update useCookie values reactively when the cookies are updated (#25198 ).

This also comes paired with a new composable, refreshCookie which allows manually refreshing cookie values, such as after performing a request. See full documentation .

🏥 Detecting anti-patterns

In this release, we've also shipped a range of features to detect potential bugs and performance problems.

  • We now will throw an error if setInterval is used on server (#25259 ).
  • We warn (in development only) if data fetch composables are used wrongly (#25071 ), such as outside of a plugin or setup context.
  • We warn (in development only) if you are not using <NuxtPage /> but have the vue-router integration enabled (#25490 ). (<RouterView /> should not be used on its own.)

🧂 Granular view transitions support

It's now possible to control view transitions support on a per-page basis, using definePageMeta (#25264 ).

You need to have experimental view transitions support enabled first:

export default defineNuxtConfig({
  experimental: {
    viewTransition: true
  },
  app: {
    // you can disable them globally if necessary (they are enabled by default)
    viewTransition: false
  }
})

And you can opt in/out granularly:

// ~/pages/index.vue
<script setup lang="ts">
definePageMeta({
  viewTransition: false
})
</script>

Finally, Nuxt will not apply View Transitions if the user's browser matches prefers-reduced-motion: reduce (#22292 ). You can set viewTransition: 'always'; it will then be up to you to respect the user's preference.

🏗️ Build-time route metadata

It's now possible to access routing metadata defined in definePageMeta at build-time, allowing modules and hooks to modify and change these values (#25210 ).

export default defineNuxtConfig({
  experimental: {
    scanPageMeta: true
  }
})

Please, experiment with this and let us know how it works for you. We hope to improve performance and enable this by default in a future release so modules like @nuxtjs/i18n and others can provide a deeper integration with routing options set in definePageMeta.

📦 Bundler module resolution

With #24837 , we are now opting in to the TypeScript bundler resolution which should more closely resemble the actual way that we resolve subpath imports for modules in Nuxt projects.

'Bundler' module resolution is recommended by Vue and by Vite , but unfortunately there are still many packages that do not have the correct entries in their package.json.

As part of this, we opened 85 PRs across the ecosystem to test switching the default, and identified and fixed some issues.

If you need to switch off this behaviour, you can do so. However, please consider raising an issue (feel free to tag me in it) in the library or module's repo so it can be resolved at source.

export default defineNuxtConfig({
  future: {
    typescriptBundlerResolution: false
  }
})

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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: tryUseNuxtApp composable (#25031 )
  • nuxt: Add experimental sharedPrerenderData option (#24894 )
  • schema: Default to bundler module resolution (#24837 )
  • nuxt: Warn if data fetch composables are used wrongly (#25071 )
  • nuxt: Add pages:routerOptions hook (#24922 )
  • Experimental client-side Node.js compatibility (#25028 )
  • nuxt: Throw error if setInterval is used on server (#25259 )
  • nuxt: refreshCookie + experimental CookieStore support (#25198 )
  • nuxt: Allow controlling view transitions in page meta (#25264 )
  • nuxt: Slow down loading indicator when approaching 100% (#25119 )
  • nuxt: Experimentally extract route metadata at build time (#25210 )
  • nuxt: useId composable (#23368 )

🔥 Performance

  • vite: Avoid endsWith when checking for whitespace (#24746 )

🩹 Fixes

  • nuxt: Disable View Transitions if prefers-reduced-motion (#22292 )
  • nuxt: Add declaration file with correct node16 imports (#25266 )
  • nuxt: Allow omitting fallback in island response (#25296 )
  • schema: Remove defineModel option as it is now stable (#25306 )
  • nuxt: Overwrite island payload instead of merging (#25299 )
  • vite: Pass hidden sourcemap values to vite (#25329 )
  • nuxt: Use named import for lazy components (#25286 )
  • nuxt: Deprecate boolean values for dedupe (#25334 )
  • nuxt: Use default export for raw components (#25282 )
  • nuxt: Handle plugin dependencies with mixed load state (#25318 )
  • nuxt: Preserve instance.attrs in client-only components (#25381 )
  • nuxt: Stop tracking suspense when error hydrating page (#25389 )
  • nuxt: Add router.options files in definite order (#25397 )
  • nuxt: Do not rerun synchronous callOnce callbacks (#25431 )
  • nuxt: Remove dynamic nuxt-client within template code (#25464 )
  • nuxt: Add runtime check to filter plugins in dependsOn (#25409 )
  • nuxt: Improve global/payload error type with NuxtError (#25398 )
  • vite: Extract styles for shared chunks (#25455 )
  • nuxt: Avoid vue-router warning with routeRule redirect (#25391 )
  • nuxt: Improve return type of useRequestEvent (#25480 )
  • nuxt: Match nitro + nuxt useRuntimeConfig signatures (#25440 )
  • nuxt: Prevent initial scroll jump when loading page (#25483 )
  • nuxt: Prioritise later items in pages:routerOptions hook (#25509 )

💅 Refactors

  • nuxt: Remove currentRoute non-ref warning (#25337 )

📖 Documentation

  • Explain how to auto-install git layer deps (#24250 )
  • Fix eslint link (87641c867 )
  • Fix typo (#25326 )
  • nuxt: Add @since annotations to exported composables (#25086 )
  • Add emphasis to useAsyncData explanation (#25392 )
  • Add separate docs page for error.vue (#25320 )
  • Add explanation about layout usage in error.vue (#25396 )
  • Use .cjs extension for ecosystem.config (#25459 )
  • Add fuller explanation in routeRules example of swr/isr (#25436 )
  • Warn that island client components don't support slots (#25454 )
  • Updated addPluginTemplate example to add filename property (#25468 )
  • Update link to vercel edge network overview (e01fb7ac3 )
  • Remove unnecessary warning on sharedPrerenderData (b0f50bec1 )
  • Add more documentation for pages:routerOptions (46b533671 )

🏡 Chore

  • Fix typo in warning log (#25265 )
  • nuxt: Warn if NuxtPage is not used when pages enabled (#25490 )
  • Remove extra 'not' in warning message (b96fe1ece )

✅ Tests

  • nuxt: Add test for data-island-uid replacement (#25346 )
  • Remove miswritten test (#25347 )
  • Avoid explicit timeouts (#25395 )

🤖 CI

  • Only release from main repo (#25354 )
  • Label pull request based on type in title (#25404 )
  • Wrap PR base label in quotes (#25432 )
  • Update extracting PR labels' names (#25437 )
  • Skip adding PR labels if there are none to add (#25475 )
  • Update changelog with github tags/handles of users (60ab5deb0 )
  • Import $fetch (a1fb399eb )

❤️ Contributors

Version v3.9.3

Released on January 17, 2024

3.9.3 is a hotfix release to address a regression with CSS in development

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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 vue and unjs ecosystems.

👉 Changelog

compare changes

🩹 Fixes

  • nuxt: Render stylesheets in dev for non-islands (#25243 )
  • nuxt: Don't set 2x data-island-uid for island children (#25245 )
  • nuxt: Don't share object between raw cookie and cookie ref (#25255 )

📖 Documentation

  • Corrects variable name used in comment (#25238 )
  • Deleted an extra character (#25248 )
  • Remove space before colon (#25251 )

✅ Tests

  • Add separate suspense test suite (#22947 )

❤️ Contributors

Version v3.9.2

Released on January 16, 2024

3.9.2 is a regularly scheduled patch release.

✅ Upgrading

As usual, our recommendation for upgrading is to run:

nuxi 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 vue and unjs ecosystems.

👉 Changelog

compare changes

🔥 Performance

  • nuxt: Iterate rather than using Object.fromEntries (#24953 )

🩹 Fixes

  • nuxt: Add missing script blocks before island transform (#25148 )
  • kit: Improve types for options in addTemplate (#25109 )
  • nuxt: Apply more import protections for nitro runtime (#25162 )
  • nuxt: Sort pages/ files in en-US locale (#25195 )
  • nuxt: Check for layout after nextTick (#25197 )
  • nuxt: Set nitro log level to match nuxt options (#25213 )
  • nuxt: Await async payload revivers (#25222 )
  • nuxt: Render user-inserted links in island responses (#25219 )

💅 Refactors

  • nuxt: Refactor island response + improve rendering (#25190 )
  • nuxt: Rename to data-island-component (#25232 )

📖 Documentation

  • Correct nuxt image discussion link (#25090 )
  • Fix typo (#25100 )
  • Suggest using <NuxtPage> rather than <RouterView> (#25106 )
  • Fix typo (#25127 )
  • Add demo for view transitions api (3c5ea3457 )
  • Remove reference to @nuxt/bridge-edge (3f09ddc31 )
  • Remove bridge recommendation only relevant Vue <= 2.6.14 (7bb90f587 )
  • Bump nuxt 2 version (98fb2be07 )
  • Remove invalid nuxi aliases (#25209 )
  • Add --log-level description (#25211 )
  • Added immediate: false in the appropriate example (#25224 )
  • Mention .global.vue filename for global components (#25144 )
  • Clarify reactivity in composables directory (#23731 )
  • Remove lagon from deployment providers (#24955 )
  • Add eslint setup guide (#24976 )
  • Add information on custom path regexp in definePageMeta (#25073 )
  • Fix addDevServerHandler API (#25233 )
  • Mention installing nuxi for bridge (637f5622d )

🏡 Chore

  • Use v3 branch sandbox in issue template (#25174 )

❤️ Contributors

Version v2.18.1

Released on June 28, 2024

👉 Changelog

compare changes

🩹 Fixes

  • webpack: Depend on earlier version of mkdirp (f67056b9e )

❤️ Contributors

Version v2.18.0

Released on June 27, 2024

👉 Changelog

compare changes

🚀 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

❤️ Contributors

Version v2.17.4

Released on June 14, 2024

👉 Changelog

compare changes

🩹 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

✅ Tests

  • Properly close page in e2e tests (1700aa131 )
  • Wait for navigation in redirect test (e74715606 )
  • Don't register promise in external nav (#27468 )

🤖 CI

❤️ Contributors

Version v2.17.3

Released on January 12, 2024

2.17.3 is the next patch release for the 2.x branch.

👉 Changelog

compare changes

💅 Refactors

  • Migrate to hookable package (#24426 )

🏡 Chore

  • Fix invalid package files with npm pkg fix (4d0474c4b )

✅ Tests

🤖 CI

  • Split type check into separate test (40f1f301e )

❤️ Contributors