TypeScript
Nuxt 完全类型化,并提供有用的快捷方式,以确保您在编码时可以访问准确的类型信息。
类型检查
默认情况下,出于性能原因,当您运行 nuxi dev
或 nuxi build
时,Nuxt 不会检查类型。
要在构建或开发时启用类型检查,请安装 vue-tsc
和 typescript
作为开发依赖项
npm install --save-dev vue-tsc typescript
然后,运行 nuxi typecheck
命令来检查您的类型
终端
npx nuxi typecheck
要在构建或开发时启用类型检查,您还可以在 nuxt.config
文件中使用 typescript.typeCheck
选项
nuxt.config.ts
export default defineNuxtConfig({
typescript: {
typeCheck: true
}
})
自动生成的类型
当您运行 nuxi dev
或 nuxi build
时,Nuxt 会生成以下文件以支持 IDE 类型(和类型检查)
.nuxt/nuxt.d.ts
此文件包含您正在使用的任何模块的类型,以及 Nuxt 所需的关键类型。您的 IDE 应该会自动识别这些类型。
该文件中的某些引用指向仅在您的 buildDir
(.nuxt
) 中生成的文件,因此要获得完整的类型,您需要运行 nuxi dev
或 nuxi build
。
.nuxt/tsconfig.json
此文件包含您的项目的推荐基本 TypeScript 配置,包括 Nuxt 或您正在使用的模块注入的已解析别名,因此您可以获得完整的类型支持和路径自动完成,例如 ~/file
或 #build/file
。
Nitro 还为 API 路由自动生成类型。此外,Nuxt 还为全局可用的组件和从您的 composables 自动导入以及其他核心功能生成类型。
请记住,从
如果您需要进一步扩展
./.nuxt/tsconfig.json
扩展的所有选项都将被 tsconfig.json
中定义的选项覆盖。使用您自己的配置覆盖诸如 "compilerOptions.paths"
之类的选项将导致 TypeScript 不考虑 ./.nuxt/tsconfig.json
中的模块解析。这可能会导致诸如 #imports
之类的模块解析无法被识别。如果您需要进一步扩展
./.nuxt/tsconfig.json
提供的选项,您可以在 nuxt.config
中使用 alias
属性。nuxi
将会选取它们并相应地扩展 ./.nuxt/tsconfig.json
。严格检查
TypeScript 提供了一些检查,以使您的程序更加安全和分析。
默认情况下,Nuxt 中启用了严格检查,以提供更大的类型安全性。
如果您当前正在将代码库转换为 TypeScript,您可能希望通过在 nuxt.config
中将 strict
设置为 false
来暂时禁用严格检查
nuxt.config.ts
export default defineNuxtConfig({
typescript: {
strict: false
}
})