Nuxt 4.0 debuts with cleaner structure, smarter data fetching & better TypeScript support

Nuxt 4.0 has launched as a stability-focused release following a year of real-world testing, introducing key changes to project organization and developer workflows. The most visible modification is the new default app/ directory, which separates application code from node_modules/ and .git/, streamlining codebase organization for developers.

Alongside structural updates, Nuxt’s starter templates have been redesigned with a new visual style that prioritizes accessibility, offers default titles, and refines template polish. These updates help new users begin projects with a more accessible and polished foundation.

Building on internal improvements, data handling with useAsyncData and useFetch is now more efficient. When multiple components use the same data key, they share cached data automatically, and resources are correctly cleaned up on component unmount. These utilities now also support reactive keys, allowing developers to trigger data refetches as needed and manage cache usage with finer control.

The update brings improved TypeScript support by creating separate projects for app code, server code, shared folders, and builder components. This enhances autocompletion and type accuracy, reducing confusing errors across development contexts. Finally, Nuxt 4.0 also features a faster command-line interface and development experience by adopting internal socket technology.