1. ホーム
  2. typescript

[解決済み] メインとテストのコンパイルを分離するために、typescriptコンパイラ(tsc)のオプションはどのように設定するのが正しいのでしょうか?

2022-03-09 23:39:59

質問

注:この問題の公開 git repo は以下にあります。 https://github.com/matthewadams/ts-test プロジェクト全体をご覧になりたい場合は、こちらをご覧ください。

私のプロジェクトでは、メインソースのコンパイルとテストソースのコンパイルを分離しようとしています。 以下は、ソースのディレクトリ構造です。

src
  main
    ...typescript source files and possibly child directories with sources
  test
    unit
      ...unit test sources
    integration
      ...integration test sources

私の目標は、コンパイルすることです。 のみ メインソースを lib/main となります。 のみ テストソースを lib/test .

メインコンパイルとテストコンパイルに共通するコンパイラーオプションをすべて tsconfig.json へのコマンドライン引数を使用します。 tsc を使用して、各コンパイルに固有のオプションを提供します。 以下は、私の現在の tsconfig.json :

{
  "compilerOptions": {
    "strict": true,
    "alwaysStrict": true,
    "diagnostics": true,
    "disableSizeLimit": true,
    "esModuleInterop": true,
    "extendedDiagnostics": true,
    "forceConsistentCasingInFileNames": true,
    "inlineSourceMap": true,
    "inlineSources": true,
    "listEmittedFiles": true,
    "listFiles": true,
    "module": "commonjs",
    "pretty": true,
    "target": "es2015"
  }
}

のスニペットです。 package.json scripts セクションは以下の通りです(Gulp, Grunt & などは複雑さを理由に拒否し、移植性を故意に犠牲にしています)。

  "scripts": {
    "transpile-main": "rm -rf lib/main && tsc --outDir lib/main --rootDir src/main -d --declarationDir lib/main",
    "transpile-test": "rm -rf lib/test && tsc --outDir lib/test --rootDir src/test --typeRoots lib/main",
    ...other scripts here...
  }

主要なソースは問題なくコンパイルでき、そのソースは lib/main を正しく表示します。 しかし、テストソースをコンパイルすると、以下のエラーが発生します。

$ npm run transpile-test

> @matthewadams/[email protected] transpile-test /Users/matthewadams/dev/me/ts-test
> rm -rf lib/test && tsc --outDir lib/test --rootDir src/test --typeRoots src/main

error TS6059: File '/Users/matthewadams/dev/me/ts-test/src/main/Nameable.ts' is not under 'rootDir' 'src/test'. 'rootDir' is expected to contain all source files.

error TS6059: File '/Users/matthewadams/dev/me/ts-test/src/main/Person.ts' is not under 'rootDir' 'src/test'. 'rootDir' is expected to contain all source files.

error TS6059: File '/Users/matthewadams/dev/me/ts-test/src/main/PersonImpl.ts' is not under 'rootDir' 'src/test'. 'rootDir' is expected to contain all source files.

混乱するのは、メッセージの 'rootDir' is expected to contain all source files. にあるものに対して、テストソースをコンパイルしようとしているのです。 lib/main . すべてのソースを1つのディレクトリにまとめたくはありません。

の正しい組み合わせは何ですか? tsconfig.json オプション & tsc cliのオプションで、メインとテストのコンパイルを分けるという目標を達成できますか?

解決方法は?

エラー: 'rootDir'にはすべてのソースファイルが含まれる必要があります。

rootDir は、すべてのソース/入力ファイルのルートであることが期待されます。TSコンパイラはこのように進みます。

collect all input files ("files" / "include" / "exclude" / imports) 
  --> for each included input file
    --> chop off the "rootDir" from the input 
    --> prepend the "outDir"

src/test ファイルからインポートします。 src/main ということで、現在 rootDir にしか設定できません。 src またはそれ以上とする。

解決策 プロジェクト リファレンス (TS 3.0+)

プロジェクトのリファレンス は、あなたが説明したすべての問題を解決することができます。

  • rootDir が設定されます。 src/main または src/test それぞれ
  • src フォルダの一部としては表示されません。 lib 出力
  • src/main インポートできない src/test (逆も可能)
出来上がったプロジェクト構造
|   tsconfig-base.json            // other config options go here
|   tsconfig.json                 // solution config containing references
|   
+---lib                           // output folder
|   +---main
|   |       mod.d.ts
|   |       mod.js
|   |       tsconfig.tsbuildinfo
|   |       
|   \---test
|           mod-test.js     
\---src
    +---main                      // referenced sub-project main 
    |       mod.ts
    |       tsconfig.json
    |       
    \---test                      // referenced sub-project test 
            mod-test.ts
            tsconfig.json

./tsconfig-base.json。
{
  "compilerOptions": {
    // just some sample values, set your own as needed
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "node",
    "strict": true,
    "esModuleInterop": true,
    // other compiler options
  }
}

./tsconfig.json。
{
  "files": [],
  "references": [
    {
      "path": "./src/main"
    },
    {
      "path": "./src/test"
    }
  ]
}

./src/main/mod.ts:
export const foo = "foo";

./src/main/tsconfig.json。
{
  "extends": "../../tsconfig-base.json",
  "compilerOptions": {
    "outDir": "../../lib/main",
    "composite": true // flag to signal referenced project      
  }
}

./src/test/mod-test.ts:
import { foo } from "../main/mod";

// use your test framework here
export function testMod() {
  if (foo !== "foo") throw new Error("foo expected.");
}

testMod()

./src/test/tsconfig.json:
{
  "extends": "../../tsconfig-base.json",
  "compilerOptions": {
    "outDir": "../../lib/test"
  },
  "references": [
    {
      "path": "../main" // test project depends on main
    }
  ]
}

プロジェクトのビルドとクリーニングは、次のようにして行います。 スクリプト :
"scripts": {
    "build": "tsc -b -v",
    "clean": "tsc -b --clean"
},

その他のリンク