[備忘録]Nuxt3でtsconfig.jsonにincludesを追加する場合の注意点

モノリポでサーバー側を別プロジェクト化していて、ファイルを共有する場合にtsconfig.jsonの修正でちょっとはまったので備忘録を残しておきます。

project
　packages
　　└　front
　　　　└　tsconfig.json
　　└　server
　　　　└　src
　　　　　　└　shared　// フロント／サーバー共用ファイル置き場

※前提として、nuxt.config.tsでrootDir: 'src',を指定しています

はまったこと

tsconfig.jsonに"include": ["./**/*", "../server/src/shared/**/*"]を追加したところ、VSCodeで名前解決が出来なくなった

project/packages/front/tsconfig.json

{
  // https://v3.nuxtjs.org/concepts/typescript
  "extends": "./src/.nuxt/tsconfig.json",
  "vueCompilerOptions": {
    "experimentalDisableTemplateSupport": true
  },
  "compilerOptions": {
    "jsx": "preserve",
    "typeRoots": ["./src/types"]
  },
  "include": ["./**/*", "../server/src/shared/**/*"]
}

原因

extendsしている.nuxt/tsconfig.jsonでincludeが定義されて入れ、上書きしてしまって型定義ファイルnuxt.d.tsのincludeが出来なくなっている

project/packages/front/src/.nuxt/tsconfig.json

// Generated by nuxi
{
  "compilerOptions": {
    ・・・
  },
  "include": [
    "./nuxt.d.ts",
    "../**/*"
  ]
}

解決

tsconfig.jsonに"files": ["./src/.nuxt/nuxt.d.ts"]を追加し、Nuxtの型定義ファイルを直接読み込むようにする

project/packages/front/tsconfig.json

{
  // https://v3.nuxtjs.org/concepts/typescript
  "extends": "./src/.nuxt/tsconfig.json",
  "vueCompilerOptions": {
    "experimentalDisableTemplateSupport": true
  },
  "compilerOptions": {
    "jsx": "preserve",
    "typeRoots": ["./src/types"]
  },
  "files": ["./src/.nuxt/nuxt.d.ts"],
  "include": ["./**/*", "../server/src/shared/**/*"]
}