ITの隊長のブログ

ITの隊長のブログです。Rubyを使って仕事しています。最近も色々やっているお(^ω^ = ^ω^)

vue-tscコマンド何もわからん

スポンサードリンク

まとめ

いきなりですが、解決していないので、まとめから。 解決しました。

  • 色々試したが vue-tsc --noEmit -p tsconfig.app.jsoncompositeコメントアウトすると型チェックが動いた
    • trueになっているとincrementalフラグがtrueになり、 vue-tsc コマンドはサポートしていないのでエラーになる
    • ただしくは vue-tsc --noEmit -p tsconfig.vitest.json --composite false でした
  • incrementalってなんだ(勉強中)
  • なんで tsconfig.jsonreferences は読み込まれないのか → そういう設定ではなかった
    • 我々調査隊はAmazon(MSだけど)の深淵へと向かった(TypeScript読込中)

tsconfig.app.json

{
  "extends": "@vue/tsconfig/tsconfig.web.json",
  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
  "exclude": ["src/**/__tests__/*"],
  "compilerOptions": {
    // "composite": true,
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

tsconfig.json

{
  "files": [],
  "include": [
    "./src/@types/**/*.ts",
  ],
  "references": [
    {
      "path": "./tsconfig.vite-config.json"
    },
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.vitest.json"
    }
  ]
}

エラー

composite:true のままだとこうなる。

$ vue-tsc --noEmit -p tsconfig.vite-config.json
incremental mode is not yet supported

/usr/local/lib/node_modules/vue-tsc/node_modules/typescript/lib/tsc.js:100196
    function createIncrementalProgram(_a) { console.error('incremental mode is not yet supported'); throw 'incremental mode is not yet supported';
                                                                                                    ^
incremental mode is not yet supported
(Use `node --trace-uncaught ...` to show where the exception was thrown)

Node.js v17.5.0

github.com

その他

tsconfig.json を読み込むと何もしてくれない。なので、 references がちゃんと効いていないんじゃないかなと思っているマンです。

追記

packages.json よく見るとこんなになってました。

"typecheck": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",

なるほど・・・・?(そしてちゃんと意図した通りに動く)

すごい遠回りしてしまったorz

というわけでこれで動きます。

$ npm run typecheck

watchした場合はoptionつけてあげると

$ npm run typecheck -- -w

追記その2

いやちゃうぞと。そもそも、tsconfig.jsonは複数で管理して良いものなんじゃなかろうかと調べたらそんな感じだった。

qiita.com

なるほど。なので、baseがあってそれを継承する形式で複数あるのね。と理解しました。

が、そしたら references ってなんだろう???っていうところではてなになってる。

zenn.dev

www.typescriptlang.org

なるほど(わからん)

わかった。でかいプロジェクトを分けたいってなったとき、referencesを使えってことね。理解。

今頃気づいたけど、reference側のtsconfig.jsonと、参照しているjsonファイルがextendsしているtsconfig.jsonが同じファイルではなかった。ということは、別に参照するからといって、継承元のjsonファイルでtscを実行する必要はないのね。勘違い。。。