类型化 TypeScript

Nuxt 3 是完全类型化的,并提供了有用的快捷方式,以确保您在编码时能够访问准确的类型信息。

类型检查

默认情况下,出于性能原因,Nuxt 在运行nuxi devnuxi build时不会检查类型。

但是,您可以通过将vue-tsctypescript安装为 devDependencies 并启用nuxt.config文件中的typescript.typeCheck选项使用 nuxi 手动检查你的类型

bash
yarn nuxi typecheck

自动生成类型

当您运行nuxi devnuxi build时,Nuxt 会为 IDE 类型支持(和类型检查)生成以下文件:

.nuxt/nuxt.d.ts

该文件包含您正在使用的任何模块的类型,以及 Nuxt 3 所需的密钥类型。 您的 IDE 应该会自动识别这些类型。

文件中的一些引用是仅在buildDir(.nuxt) 中生成的文件,因此对于完整类型,您需要运行nuxi devnuxi build

.nuxt/tsconfig.json

此文件包含为您的项目推荐的基本 TypeScript 配置,包括由 Nuxt 或您正在使用的模块注入的已解析别名,因此您可以获得完整的类型支持和别名的路径自动完成,例如~/file#build/file

阅读更多有关如何扩展此配置的信息

Nitro 还为 API 路由 自动生成类型
此外,Nuxt 还为全局可用的组件和从您的可组合项自动导入 以及其他核心功能生成类型。

请记住,从./.nuxt/tsconfig.json扩展的所有选项都将被tsconfig.json中定义的选项覆盖。
使用您自己的配置覆盖诸如compilerOptions.paths之类的选项将导致 TypeScript 不考虑来自./.nuxt/tsconfig.json的模块分辨率。 这可能导致无法识别诸如#imports之类的模块解析。

如果您需要进一步扩展./.nuxt/tsconfig.json提供的选项,您可以在nuxt.config中使用 alias属性 .nuxi将拾取它们并相应地扩展./.nuxt/tsconfig.json

更严格的检查

TypeScript 带有某些检查,可以为您的程序提供更多安全性和分析。

将代码库转换为 TypeScript 并熟悉它后,您可以开始启用这些检查以提高安全性(阅读更多)。

为了启用严格的类型检查,你必须更新nuxt.config

js
export default defineNuxtConfig({
  typescript: {
    strict: true
  }
})