跳到主要内容

TypeScript

了解如何在 Nuxt Bridge 中使用 TypeScript。

移除模块

  • 移除 @nuxt/typescript-build:Bridge 启用了相同的功能
  • 移除 @nuxt/typescript-runtimenuxt-ts:Nuxt 2 内置了运行时支持

设置 bridge.typescript

import { defineNuxtConfig } from '@nuxt/bridge'

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

更新 tsconfig.json

如果你正在使用 TypeScript,可以编辑你的 tsconfig.json 来受益于自动生成的 Nuxt 类型:

tsconfig.json
{
+ "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    ...
  }
}
由于 .nuxt/tsconfig.json 是生成的,且不会纳入版本控制,你需要在运行测试之前生成该文件。将 nuxi prepare 作为测试之前的一个步骤添加进去,否则你会看到 TS5083: Cannot read file '~/.nuxt/tsconfig.json'对于现代的 Nuxt 项目,我们推荐使用 TypeScript 项目引用,而不是直接扩展 .nuxt/tsconfig.json。 ::
请记住,从 ./.nuxt/tsconfig.json 继承的所有选项都会被你的 tsconfig.json 中定义的选项覆盖。用你自己的配置覆盖诸如 "compilerOptions.paths" 这样的选项会导致 TypeScript 无法考虑来自 ./.nuxt/tsconfig.json 的模块解析。这可能导致 #imports 等模块解析无法被识别。如果你需要进一步扩展 ./.nuxt/tsconfig.json 提供的选项,可以在你的 nuxt.config 中使用 alias 属性。nuxi 会接收它们并相应地扩展 ./.nuxt/tsconfig.json。 ::