Nuxt 4 is already born and giving your first steps! Check out in this post how to migrate your current Nuxt 3 project to Nuxt 4. 🚀
Don't be upset about another Vue or Nuxt migration (yeah, migrations s*cks, I know...), but that one is easy and well documented by the Vue/Nuxt core team and I'll share my favorite way for do it.
⚠️ Quickly reminder: Nuxt 4 has not been officialy released yet, but available for use and testing, so be careful when migrating large codebases.
1 - Introducing codemods
Codemods are automated scripts used to refactor codebases quickly and consistently. They are particularly helpful during major upgrades, like migrating to Nuxt 4, where some breaking changes and deprecations may require updates across your project.
By using codemods, you can automate repetitive tasks, such as renaming files, updating APIs, or adapting to new directory structures (that one is life savier for Nuxt 4 migration).
2 - Set compatibily version on nuxt.config.ts
Before install and run the migration codemod, make sure to set compatibilityVersion
to 4
in your nuxt.config.ts
:
export default defineNuxtConfig({
future: {
compatibilityVersion: 4,
}
})
You will be able to remove this when Nuxt 4 will be officially released.
3 - Run the codemod script
In this step you'll need to run the codemod script for migrate your current Nuxt 3 project structure for Nuxt 4 structure.
⚠️ Before finnaly run the codemod script, read more about the changes that will happen on Nuxt 4 and the impact of each one on the official upgrade guide:
https://nuxt.com/docs/getting-started/upgrade#testing-nuxt-4
Run this codemod script in your terminal inside the project folder:
npx codemod@latest nuxt/4/migration-recipe
When you run this script, you'll have the option for select only the changes that you want to be done.
After that, the codemod will make sure to make all the changes that you have choosen and let your code ready for Nuxt 4!
Do I need to migrate for Nuxt 4 now? I'm out of time? 😱
Definitively not! You can be prepared and test early but you don't need to migrate now, Nuxt 4 is currently in the testing phase and we're waiting for a big update of Nitro for it to be officially released.
Check this video from Alexander Lichter for further understanding:
Top comments (0)