Published 10 Jun 2025

A migration tale: Nuxt2 to Nuxt3

The hurdles, the unexpected and the benefits of migrating to Nuxt3

The hurdles


Third party dependencies


Your first friction point is the long-tail of Vue 2-only modules. Anything that still patches Vue.extend, injects $root, or relies on the old vue-meta stack will break as soon as you switch to Vue 3 and Nuxt 3. Audit → fork → or replace; there is rarely a “drop-in” upgrade. Nuxt Bridge can buy you time, but it’s a tactical stop-gap, not a solution.


Downstream libraries


If you publish an npm package that Nuxt sites consume, you now have to ship dual builds (CJS + ESM) and peer-depend on vue 3 and nuxt 3. That means updating your Rollup/Vite config, enabling build.transpile, and documenting new composable-centric APIs so integrators aren’t left with a mixed Options/Composition API surface


Workaround


We created a monorepo with two demo projects: one frozen on Nuxt 2 for regression testing, and one green-field Nuxt 3 playground. When CI and QA shows parity on both, the library is ready. For edge-case modules you can’t control, wrap them in a plugin that lazy-imports only in SSR-false mode, decoupling the rest of your codebase.


The unexpected


Key breaking changes


Nuxt 3 introduces the Nitro engine, a new filesystem-first routing layer, app.vue instead of layouts/error.vue, and useHead powered by Unhead instead of head() options. Even simple helpers like $config are now tree-shakable composables (useRuntimeConfig). Reading the migration guide alone won’t expose all of these subtle API pivots


AI Failure


Auto-migration codemods and code-generation-powered GPT prompts promise “one click upgrades,” but in practice they stumble on nuanced cases: dynamic imports inside middleware, legacy Vuex plugins, or macro-annotated <script setup> blocks. Treat AI as a lint pass, not a silver bullet—you’ll still need manual review.


The Benefits


Build time


Nuxt 3 swaps Webpack for Vite, slicing cold-start times from minutes to seconds and slashing production bundles. Real-world benchmarks report 30 × faster builds on medium-sized projects and 7 % lighter output thanks to automatic tree-shaking


Runtime performance boost


Moving to Vue 3 delivers ~30 % faster render throughput out-of-the-box, while Nitro’s H3 server and Edge-ready adapters shrink Time-to-First-Byte for every page request


Composition API


Your library gains type-safe, reusable composables, defineExpose, and <script setup> ergonomics. This reduces boilerplate, improves DX, and unlocks first-class TypeScript support


Auto imports & smaller bundles


Nuxt 3’s auto-import layer discovers composables, utils, and components at build time. Consumers of your npm package import only what they use, cutting dead weight and improving Core Web Vitals, a high-value metric for e-commerce SEO



Key takeaways


Migrating an npm library from Nuxt 2 to Nuxt 3 isn’t trivial and even with AI help you'll need to spend some time reviewing and fine-tuning the output. But the performance, DX, and future-proofing gains outweigh the hurdles. Start with a dependency audit, embrace composables, and harness Vite’s speed to deliver the snappiest storefront experiences in 2025.


Nuxt 3 was a major rewrite and defines the new architecture of Nuxt app. Nuxt 4 will continue on this path that's why moving to Nuxt 3 is an unavoidable step.