Nuxt 3.3

✨ 本地模块开发 DX

我们进行了一系列更改，以启用本地模块并改进 DX。

我们现在会自动扫描您的 ~/modules 文件夹，并将顶层文件注册为项目中的模块 (#19394)。

当这些文件发生更改时，我们将自动重启 nuxt 服务器。

export default defineNuxtConfig({
  modules: [
    '@nuxtjs/tailwindcss',
-   '~/modules/purge-comments'
  ]
})

我们现在还公开了 nuxt/kit，以便在您的本地项目中轻松访问 kit composables，而无需安装 @nuxt/kit (#19422)。

阅读有关本地模块的文档.

♻️ 重启 Nuxt

您可以将文件添加到 watch 数组以自动重启服务器 (#19530)。这对于模块作者来说尤其有用。您还可以使用新的 restart 钩子触发 Nuxt 服务器的重启 (#19084)。

🔥 性能改进

作为最佳实践，我们将静态资源 maxAge 增加到 1 年 (#19335)，并支持更多构建的 tree-shaking (#19508)。

我们现在还支持使用对象语法的路由预加载 <NuxtLink> (#19120)

<NuxtLink :to="{ name: 'home', query: { year: '2023' } }">Home</NuxtLink>

我们还会跟踪您使用的每个模块执行设置所花费的时间，并在时间过长时发出警告。您可以通过使用 DEBUG=1 运行开发服务器来查看所有这些值 (#18648)。

DEBUG=1 npx nuxt dev
ℹ Module pages took 1.5ms to setup.
ℹ Module meta took 3.15ms to setup
ℹ Module components took 4.5ms to setup.
...

您还可以选择加入 Nuxt 的一些内部优化，方法是将 composables 配置为在特定环境中进行 treeshaken (#19383) 或自动注入 magic keys (#19490)。

🐛 错误处理

我们现在默认处理 chunk 错误 (#19086)，这意味着如果您的站点通过重新部署进行更新，我们会在导航时自动处理重新加载。

要禁用此行为，请将 experimental.emitRouteChunkError 选项设置为 'manual'，并使用新的 reloadNuxtApp composable 自行处理。了解更多关于我们在 chunk-reload.client.ts 插件中如何实现的。

您还可以设置 experimental.restoreState 以在重新加载时保留一些应用程序状态

defineNuxtConfig({
  experimental: {
    restoreState: true
  }
})

我们还有一个新的实验性错误处理组件：<NuxtClientFallback> (#8216)，它可以捕获服务器端渲染时发生的错误，将其替换为回退内容，并在客户端粒度化地触发错误部分的重新渲染。可以通过 experimental.clientFallback 启用 - 非常欢迎反馈！

⚡️ Head 改进

我们已迁移到直接使用 unhead (#19519) - 并自动从客户端构建中 tree-shake 仅服务器端 head composables，例如 useServerHead (#19576)，这意味着您可以拥有出色的 SEO，而无需在客户端构建中包含仅与爬虫相关的 meta 标签逻辑。

还有一个新的 useHeadSafe composable，用于处理清理不受信任的用户输入 (#19548)。

🪵 浏览器 DevTools 中更好的日志记录

通过与 Chrome DevTools 团队合作，我们在 unjs + Nuxt 生态系统中实现了一些功能，这意味着我们现在对在您的（目前基于 Chromium 的）浏览器日志中隐藏 Nuxt 内部堆栈跟踪提供了一流的支持 #19243。我们还在涉及 Nuxt 钩子的堆栈跟踪方面进行了一些改进 (unjs/hookable#69 和 unjs/hookable#68)，实现了 console.createTask。

之前	之后

💪 类型改进

服务器 API 路由的类型现在更加正确 - 非可序列化类型已从返回类型中剥离 (unjs/nitro#1002)。

我们现在还对更多 NuxtApp 进行类型化，并正确键入未知注入，以提高类型安全性 (#19643)。

如果您在使用 Nuxt 数据获取 composables 的 transform + default 时遇到正确的类型问题，请不要再担心 - 我们现在可以正确推断类型了 (#19487)。

⚗️ Nitro 增强功能

此版本附带 Nitro v2.3，它带来了许多自身的改进。查看 发布说明 以获取更多信息。

我们现在在 nitro 服务器路由中支持 useAppConfig (#19489) - 一个期待已久的更改。现在，useAppConfig 在整个应用程序中始终可用，用于来自 layers、modules 等的非运行时配置。

我们还添加了一个 nitro:build:public-assets 钩子，允许修改 nitro 的预渲染/构建阶段输出的 assets (#19638)。

🛠️ 构建更改

作为朝着 一流支持 PNP 和无需 --shamefully-hoist 的 pnpm 支持 的一部分，我们放弃了对一些使用 CJS 解析模式的内部（已弃用）实用程序的支持 (#19537 和 #19608)。

我们现在还使用 ESM 搜索路径解析 nuxt、@nuxt/kit 等依赖项。我们将密切关注这一点。

我们还在为支持新的 TypeScript Node16 模块解析做准备 (#19606)，并且作为其中的一部分，我们更改了运行时输出的格式（使用 .js 而不是 .mjs 扩展名，为子路径导出提供 types 字段等等）。

🗺️ 自定义配置架构（高级）

我们一直在测试一项实验性功能，允许模块和用户扩展 Nuxt 配置架构 (#15592)，现在我们默认启用了此功能 (#19172)。我们预计这将对模块和 layer/theme 作者特别有用，并应为他们的用户带来更好的 DX。

更新日志

通过比较更改或查看 GitHub 上的发布说明，查看完整的更新日志。

我们要感谢为此次发布做出贡献的 28 位贡献者 💚