---
title: "Nuxt 3.13"
description: "Nuxt 3.13 已发布——将我们为 Nuxt 4 正在构建的一些新功能回迁回来！"
canonical_url: "https://nuxt.zhcndoc.com/blog/v3-13"
---
# Nuxt 3.13

> Nuxt 3.13 已发布——将我们为 Nuxt 4 正在构建的一些新功能回迁回来！

## 🏘️ 路由分组

我们现在支持使用括号/方括号命名目录，以整理您的路由，而不影响路径。

例如：

```bash [目录结构]
-| pages/
---| index.vue
---| (marketing)/
-----| about.vue
-----| contact.vue
```

这将在您的应用中生成 `/`、`/about` 和 `/contact` 页面。`marketing` 组在 URL 结构中被忽略。

阅读更多内容请查看 [原始 PR](https://github.com/nuxt/nuxt/pull/28276)。

## 🏝️ 岛屿与头部元数据

现在，服务器组件岛屿可以操作头部，例如在渲染时添加 SEO 元数据。

阅读更多内容请查看 [#27987](https://github.com/nuxt/nuxt/pull/27987)。

## 🪝 自定义预取触发器

我们现在支持 `NuxtLink` 的自定义预取触发器 ([#27846](https://github.com/nuxt/nuxt/pull/27846))。

例如：

```vue [pages/index.vue]
<template>
  <div>
    <NuxtLink prefetch-on="interaction">
      当鼠标悬停或获得焦点时将进行预取
    </NuxtLink>
    <!-- 请注意，您可能不想同时启用这两个选项！ -->
    <NuxtLink :prefetch-on="{ visibility: true, interaction: true }">
      当鼠标悬停/获得焦点 - 或变得可见时进行预取
    </NuxtLink>
  </div>
</template>
```

您还可以全局启用/禁用这些功能，并在每个链接上进行覆盖。

例如：

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  experimental: {
    defaults: {
      nuxtLink: {
        prefetch: true,
        prefetchOn: { visibility: false, interaction: true }
      }
    }
  }
})
```

## 🗺️ 改进的服务器源映射

在使用 `node --enable-source-maps` 运行时，您可能已经注意到，服务器构建中的 Vue 文件的源映射指向 Vite 构建输出（类似于 `.nuxt/dist/server/_nuxt/index-O15BBwZ3.js`）。

现在，即使在您的 Nitro 构建之后，您的服务器源映射也将引用您的原始源文件 ([#28521](https://github.com/nuxt/nuxt/pull/28521))。

请注意，提高构建性能的最简单方法之一是关闭源映射（如果您不使用它们），您可以在 `nuxt.config.ts` 中轻松做到这一点：

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  sourcemap: {
    server: false,
    client: true,
  },
})
```

## 🎁 模块作者的新功能

在 Nuxt v4 发布前，我们正在为模块作者添加一些关键功能，包括在需要时提供新的 `isNuxtMajorVersion` 工具 ([#27579](https://github.com/nuxt/nuxt/pull/27579)) 和使用新的 `defineNuxtModule().with()` 方法对合并模块选项进行更好的推断类型 ([#27520](https://github.com/nuxt/nuxt/pull/27520))。

## ✨ 改进的开发警告

我们不再警告在中间件中使用数据获取组合函数 ([#28604](https://github.com/nuxt/nuxt/pull/28604))，并且当用户组件的名称以 Lazy 开头时会发出警告 ([#27838](https://github.com/nuxt/nuxt/pull/27838))。

## 🚨 Vue TypeScript 更改

在 Vue 生态系统中，我们在一段时间内增补了 `@vue/runtime-core` 以添加自定义属性等到 `vue`。然而，这无意中破坏了增强 `vue` 的项目的类型 - 这现在是官方推荐并文档化的增强这些接口的方式（例如， [ComponentCustomProperties](https://vue.zhcndoc.com/api/utility-types.html#componentcustomproperties)、[GlobalComponents](https://vue.zhcndoc.com/guide/extras/web-components.html#web-components-and-typescript) 等）。

这意味着 *所有* 库必须更新它们的代码（否则会破坏增强 `vue` 的库的类型）。

我们已经在 Nuxt 中沿着这些方向更新了我们的类型，但当您使用尚未更新的库时，您可能会遇到与最新的 `vue-router` 的问题。

请创建一个带有复现的 issue - 我很乐意帮助您在相关上游库中创建 PR 来解决这个问题。或者，您也可以尝试通过在项目根目录中创建 `declarations.d.ts` 文件，使用以下代码来解决问题 ([credit](https://github.com/nuxt/nuxt/pull/28542#issuecomment-2293282891) 给 [@BobbieGoede](https://github.com/BobbieGoede))：

```ts [declarations.d.ts]
import type {
  ComponentCustomOptions as _ComponentCustomOptions,
  ComponentCustomProperties as _ComponentCustomProperties,
} from 'vue';

declare module '@vue/runtime-core' {
  interface ComponentCustomProperties extends _ComponentCustomProperties {}
  interface ComponentCustomOptions extends _ComponentCustomOptions {}
}
```

## ✅ 升级

和往常一样，我们的升级建议是运行：

```sh
npx nuxi@latest upgrade --force
```

这将刷新您的锁文件，并确保您拉取 Nuxt 所依赖的其他依赖项的更新，特别是在 unjs 生态系统中。

## 完整的发布说明

::read-more{icon="i-simple-icons-github" target="_blank" to="https://github.com/nuxt/nuxt/releases/tag/v3.13.0"}
阅读 Nuxt `v3.13.0` 的完整发布说明。
::

非常感谢所有参与本次发布的人 - 你们是让 Nuxt 成为可能的关键。 ❤️

如果您有任何反馈或问题，请随时告知我们！ 🙏


## Sitemap

See the full [sitemap](https://nuxt.zhcndoc.com/sitemap.md) for all pages.
