TypeScript

Nuxt Bridge에서 TypeScript를 사용하는 방법을 알아보세요.

모듈 제거

  • @nuxt/typescript-build 제거: Bridge가 동일한 기능을 제공합니다
  • @nuxt/typescript-runtime 및 nuxt-ts 제거: Nuxt 2에는 런타임 지원이 내장되어 있습니다

bridge.typescript 설정

import { defineNuxtConfig } from '@nuxt/bridge'

export default defineNuxtConfig({
  bridge: {
    typescript: true,
    nitro: false, // Nitro로의 마이그레이션이 완료되었다면 true로 설정
  },
})

tsconfig.json 업데이트

TypeScript를 사용 중이라면, 자동 생성되는 Nuxt 타입의 이점을 누리기 위해 tsconfig.json을 다음과 같이 수정할 수 있습니다:

tsconfig.json
{
+ "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    ...
  }
}
.nuxt/tsconfig.json은 생성되는 파일이며 버전 관리에 포함되지 않으므로, 테스트를 실행하기 전에 해당 파일을 생성해야 합니다. 테스트 전에 nuxi prepare를 단계로 추가하지 않으면 TS5083: Cannot read file '~/.nuxt/tsconfig.json' 오류가 발생합니다.최신 Nuxt 프로젝트에서는 .nuxt/tsconfig.json을 직접 확장하는 대신 TypeScript 프로젝트 참조를 사용할 것을 권장합니다.
./.nuxt/tsconfig.json에서 확장된 모든 옵션은 tsconfig.json에 정의된 옵션에 의해 덮어쓰인다는 점을 유의하세요. "compilerOptions.paths"와 같은 옵션을 사용자 설정으로 덮어쓰면, TypeScript는 ./.nuxt/tsconfig.json에서 제공하는 모듈 해석을 고려하지 않게 됩니다. 이로 인해 #imports와 같은 모듈 해석이 인식되지 않을 수 있습니다../.nuxt/tsconfig.json에서 제공하는 옵션을 추가로 확장해야 하는 경우, nuxt.config 내에서 alias 속성을 사용할 수 있습니다. nuxi가 이를 감지하여 ./.nuxt/tsconfig.json을 그에 맞게 확장합니다.