Nuxt on GitHub
版本发布·  

Nuxt 4.0 正式发布

Nuxt 4.0 来了！这是一次专注于开发者体验的精心演进，带来更清晰的项目结构、更智能的数据获取和更强的类型安全。
Daniel Roe

Daniel Roe

@danielroe.dev

Nuxt 4.0 震撼发布！ 🎉

经过一年的实际测试，我们兴奋地宣布 Nuxt 4 正式发布。这是一个以稳定性为核心的重大版本，通过少量精心设计的破坏性变更来提升开发体验。

如果您一直关注我们的进展，会发现许多功能和变更都很熟悉；如果是初次接触，希望您会喜欢它们。

🔥 新特性亮点

Nuxt 4 致力于让您的开发体验更流畅：

  • 更清晰的项目结构：全新的 app/ 目录结构
  • 更智能的数据获取：我们借此机会解决了数据层的一些不一致问题并提升了性能
  • 更强的 TypeScript 支持：通过项目级隔离区分应用代码、服务端代码、shared/ 文件夹和配置
  • 更快的 CLI 和开发体验：采用内部 socket 通信和更快的 CLI

为什么选择这些特性？主要是因为这类改进需要在技术上做出破坏性变更。

我们秉持"不炒作"的发布理念，没有刻意囤积功能等待大版本发布，而是持续在 Nuxt 3 的小版本中交付改进。

我们也投入了大量时间研究如何以向后兼容的方式实现这些变更，希望大多数 Nuxt 3 项目能以最小成本完成升级。

建议在开始前阅读升级指南，了解可能受影响的部分。

🗂️ 全新项目结构

最显著的变化是项目组织方式。现在应用代码默认存放在 app/ 目录：

my-nuxt-app/
├─ app/
│  ├─ assets/
│  ├─ components/
│  ├─ composables/
│  ├─ layouts/
│  ├─ middleware/
│  ├─ pages/
│  ├─ plugins/
│  ├─ utils/
│  ├─ app.vue
│  ├─ app.config.ts
│  └─ error.vue
├─ content/
├─ public/
├─ shared/
├─ server/
└─ nuxt.config.ts

这种结构将您的代码与 node_modules/ 和 .git/ 分离，显著提升文件监听速度（尤其在 Windows 和 Linux 上），同时为 IDE 提供更明确的上下文信息。

不想迁移？ 完全没问题！Nuxt 会检测现有结构并保持原有工作方式。

🎨 更新的 UI 模板

Nuxt 的启动模板焕然一新，改进了无障碍访问、默认标题和模板细节 (#27843)。

🔄 更智能的数据获取

我们优化了 useAsyncData 和 useFetch：

  • 相同 key 的多个组件现在自动共享数据
  • 组件卸载时自动清理
  • 支持响应式 key 触发重新获取
  • 提供更精细的缓存控制策略

部分功能已在 Nuxt 3 小版本中逐步推出。Nuxt 4 调整了默认行为，并将在未来持续改进数据层。

🔧 更好的 TypeScript 体验

Nuxt 现在会为应用代码、服务端代码、shared/ 文件夹和构建代码创建独立的 TypeScript 项目。这意味着：

  • 更准确的自动补全
  • 更精确的类型推断
  • 不同上下文中更少的混淆错误
Nuxt 4 只需在项目根目录保留一个 tsconfig.json 文件！

这可能是升级时最容易出现意外的地方，但从长远看会显著改善 TypeScript 体验。欢迎反馈任何问题。🙏

⚡ 更快的 CLI 和开发体验

我们同步优化了 @nuxt/cli：

  • 更快的冷启动：开发服务器启动明显加快
  • Node.js 编译缓存：自动复用 v8 编译缓存
  • 原生文件监听：使用 fs.watch API 降低系统资源占用
  • 基于 socket 的通信：CLI 和 Vite 开发服务器改用内部 socket 通信，减少开销（特别在 Windows 上）

这些改进将显著提升日常开发体验，我们还有更多优化计划。

🚀 如何升级

虽然重大版本会引入破坏性变更，但我们确保升级路径尽可能平滑。大多数破坏性变更已通过兼容性标志测试超过一年。

多数项目可以平滑升级，但需要注意：

  • @nuxt/kit 移除了 Nuxt 2 兼容性（主要影响模块作者）
  • 清理了遗留工具和废弃功能
  • 新的 TypeScript 设置可能暴露之前隐藏的类型问题
  • 少数模块可能需要更新以获得完整兼容性

别担心，对于大多数破坏性变更，我们都提供了回退到旧行为的配置选项。

1. 更新 Nuxt

推荐使用以下命令升级：

npx nuxt upgrade --dedupe

这会同时优化 lockfile，确保更新 Nuxt 依赖的其他包（特别是 unjs 生态中的依赖）。

2. 可选：使用迁移工具

我们与 Codemod 合作自动化了许多迁移步骤：

npx codemod@latest nuxt/4/migration-recipe

3. 测试和调整

运行测试，检查构建情况，修复出现的问题。升级指南 包含具体场景的详细迁移步骤。

建议在开始前完整阅读，了解可能受影响的部分。

🗺️ 未来规划

我们将快速发布补丁版本修复问题。Nuxt 3 会持续获得维护更新（包括错误修复和从 Nuxt 4 回迁的功能）直到 2026 年 1 月，所以您有充足时间迁移。

展望未来，我们计划尽快发布 Nuxt 5，它将带来：

  • Nitro v3 和 h3 v2 实现更高性能
  • 采用 Vite Environment API 提供更好（更快！）的开发体验
  • 还有更多令人兴奋的功能！

此外，许多新特性将陆续登陆 Nuxt 3.x 和 4.x 分支，包括：

  • SSR 流式支持 (#4753)
  • 官方无障碍访问模块 (#23255)
  • 内置获取缓存策略 (#26017)
  • 强类型 fetch 调用（将在 Nitro v3 实现）
  • 动态路由发现 (#32196)
  • 多应用支持 (#21635)
  • 等等

❤️ 致谢

这个版本凝聚了众多贡献者的心血，特别感谢过去一年测试 v4 兼容模式的开发者们。衷心感谢大家的帮助！

祝您使用 Nuxt 4 编码愉快！🚀

📑 完整发布说明

阅读 Nuxt v4.0.0 完整发布说明。

向所有参与此版本的贡献者致以诚挚谢意。❤️

← Back to blog
Nuxt on LinkedInNuxt on BlueskyNuxt on X