⚡️ Vue 3.3 发布
Vue 3.3 已经发布，带来了许多令人兴奋的功能，尤其是在类型支持方面。
- 新的
defineOptions宏 - 'generic' 组件
- 类型化的插槽以及在 defineProps 中使用外部类型
- ... 以及更多
这也为在嵌套页面之间导航时的数据获取带来了显著改进 (#20777)，感谢 @antfu 和 @baiwusanyu-c。
阅读 完整发布公告 以了解更多详情。
🙌 Nitropack v2.4
我们一直在努力改进 Nitro，这些改进已经落实到 Nitro v2.4 中 - 您可能已经获得了此升级，其中包含许多错误修复、Cloudflare 模块 worker 格式的更新、Vercel KV 支持等等。
注意：如果您要部署到 Vercel 或 Netlify 并希望从增量静态再生中受益，您现在应该更新您的路由规则
routeRules: {
-- '/blog/**': { swr: 3000 },
++ '/blog/**': { isr: 3000 },
}
阅读 完整发布说明。
💖 富 JSON 载荷
富 JSON 载荷序列化 现在默认启用 (#19205, #20770)。这既更快，又允许在从 Nuxt 服务器传递到客户端的载荷中序列化复杂对象（以及在为预渲染站点提取载荷数据时）。
现在这意味着 各种富 JS 类型开箱即用：正则表达式、日期、Map 和 Set 以及 BigInt，以及 NuxtError - 以及 Vue 特定的对象，如 ref、reactive、shallowRef 和 shallowReactive。
您可以在我们的测试套件中找到 一个示例。
这一切都归功于 Rich-Harris/devalue#58。长期以来，由于序列化 Errors 和其他非 POJO 对象的问题，Nuxt 一直使用我们自己的 devalue 分支，但我们现在已过渡回原始版本。
您甚至可以使用新的对象语法 Nuxt 插件注册您自己的自定义类型
export default definePayloadPlugin(() => {
definePayloadReducer('BlinkingText', data => data === '<original-blink>' && '_')
definePayloadReviver('BlinkingText', () => '<revivified-blink>')
})
您可以 在此处 阅读更多关于其工作原理的信息。
🛝 交互式服务器组件
此功能应被视为高度实验性，但由于 @huang-julien 的出色工作，我们现在通过 插槽 支持服务器组件内的交互式内容 (#20284)。
您可以在 #19772 关注服务器组件路线图。
⏰ 环境配置
您现在可以在您的 nuxt.config 中配置完全类型化的、按环境覆盖的配置
export default defineNuxtConfig({
$production: {
routeRules: {
'/**': { isr: true }
}
},
$development: {
//
}
})
如果您正在编写 layers，您还可以使用 $meta 键来提供您或您的 layer 的使用者可能使用的元数据。
阅读更多 关于按环境覆盖的信息。
💪 完全类型化的页面
通过与 unplugin-vue-router 的这项实验性集成，您可以在您的 Nuxt 应用程序中受益于完全类型化的路由 - 感谢 @posva 的出色工作！
开箱即用，这将启用 navigateTo, <NuxtLink>, router.push() 等的类型化用法。
您甚至可以通过使用 const route = useRoute('route-name') 在页面中获取类型化的参数。
直接在您的 nuxt.config 中启用此功能
export default defineNuxtConfig({
experimental: {
typedPages: true
}
})
🔎 “Bundler” 模块解析
我们现在在 Nuxt 中完全支持 模块解析 的 bundler 策略。
如果可能，我们建议采用此策略。例如，它具有子路径导出的类型支持，但比 Node16 解析更准确地匹配 Vite 和 Nuxt 等构建工具的行为。
export default defineNuxtConfig({
typescript: {
tsConfig: {
compilerOptions: {
moduleResolution: 'bundler'
}
}
}
})
这开启了 TypeScript “跟随” Node 子路径导出的能力。例如，如果一个库有一个像 mylib/path 这样的子路径导出，它被映射到 mylib/dist/path.mjs，那么它的类型可以从 mylib/dist/path.d.ts 中拉取，而无需库作者创建 mylib/path.d.ts。
⚗️ 分离服务器类型
我们计划提高 IDE 中应用程序的 “nitro” 和 “vue” 部分之间的清晰度，我们已经通过为您的 ~/server 目录生成单独的 tsconfig.json 文件实现了第一部分 (#20559)。
您可以通过添加一个额外的 ~/server/tsconfig.json 文件并包含以下内容来使用
{
"extends": "../.nuxt/tsconfig.server.json"
}
尽管目前在类型检查时 (nuxi typecheck) 这些值不会被采用，但您应该在您的 IDE 中获得更好的类型提示。
💀 弃用
虽然我们没有类型化或记录 Nuxt 2 中的 build.extend 钩子，但我们一直在 webpack 构建器中调用它。我们现在明确声明弃用此钩子，并将在未来的次要版本中删除它。
✅ 升级
像往常一样，我们升级的建议是运行
npx nuxi upgrade --force
这也将刷新您的 lockfile，并确保您从 Nuxt 依赖的其他依赖项中拉取更新，尤其是在 unjs 生态系统中。
📃 完整更新日志
阅读 https://github.com/nuxt/nuxt/releases/tag/v3.5.0 上的完整发布说明