通过 100 多个技巧学习 Nuxt!

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 // If migration to Nitro is complete, set to 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/tsconfig.json 扩展的选项都将被 tsconfig.json 中定义的选项覆盖。使用您自己的配置覆盖 "compilerOptions.paths" 等选项将导致 TypeScript 不考虑 ./.nuxt/tsconfig.json 中的模块解析。这可能导致诸如 #imports 之类的模块解析无法被识别。如果您需要进一步扩展 ./.nuxt/tsconfig.json 提供的选项,您可以使用 nuxt.config 中的 alias 属性。nuxi 将会选择它们并相应地扩展 ./.nuxt/tsconfig.json