---
title: "TypeScript"
description: "学习如何在 Nuxt Bridge 中使用 TypeScript。"
canonical_url: "https://nuxt.zhcndoc.com/docs/3.x/bridge/typescript"
---
# TypeScript

> 学习如何在 Nuxt Bridge 中使用 TypeScript。

## 移除模块

- 移除 `@nuxt/typescript-build`：Bridge 已经启用相同功能
- 移除 `@nuxt/typescript-runtime` 和 `nuxt-ts`：Nuxt 2 内置运行时支持

### 设置 `bridge.typescript`

```ts
import { defineNuxtConfig } from '@nuxt/bridge'

export default defineNuxtConfig({
  bridge: {
    typescript: true,
    nitro: false, // 如果已完成迁移到 Nitro，设置为 true
  },
})
```

## 更新 `tsconfig.json`

如果你正在使用 TypeScript，可以编辑你的 `tsconfig.json`，以利用 Nuxt 自动生成的类型：

```diff [tsconfig.json]
{
+ "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    ...
  }
}
```

::note
由于 `.nuxt/tsconfig.json` 是生成文件且不纳入版本控制，你需要在运行测试前生成该文件。请在测试之前添加 `nuxi prepare` 这一步，否则会看到 `TS5083: 无法读取文件 '~/.nuxt/tsconfig.json'`
::

::note
请注意，从 `./.nuxt/tsconfig.json` 继承的所有选项会被你在 `tsconfig.json` 中定义的选项覆盖。  
如果用你自己的配置覆盖例如 `"compilerOptions.paths"`，TypeScript 将不会考虑 `./.nuxt/tsconfig.json` 中的模块解析。这可能导致诸如 `#imports` 之类的模块解析无法被识别。

如果你需要进一步扩展 `./.nuxt/tsconfig.json` 提供的选项，可以在 `nuxt.config` 中使用 `alias` 属性。`nuxi` 会读取它们并相应地扩展 `./.nuxt/tsconfig.json`。
::


## Sitemap

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