ワークスペース

Sample Project

Vitest は、ワークスペース設定ファイルを使用することで、モノレポに対する組み込みのサポートを提供します。ワークスペースを作成して、プロジェクトのセットアップを定義できます。

ワークスペースの定義

ワークスペースは、ルートディレクトリに vitest.workspace または vitest.projects ファイルを持つ必要があります（既存の構成ファイルがある場合は、同じディレクトリに配置してください）。Vitest は、これらのファイルに対して ts/js/json 拡張子をサポートしています。

ワークスペース設定ファイルは、プロジェクトを参照するファイルパスまたはグロブパターンのリストをデフォルトエクスポートする必要があります。たとえば、packages という名前のディレクトリにプロジェクトが含まれている場合は、次の構成ファイルでワークスペースを定義できます。

vitest.workspace.ts

export default ['packages/*'];

Vitest は、packages ディレクトリ内のすべてのディレクトリを、個別のプロジェクトとして認識します（構成ファイルがなくても）。

WARNING

Vitest は、ルートディレクトリの構成をワークスペースプロジェクトとはみなしません。したがって、この構成で明示的に指定されていない限り、include で指定されたテストは実行されません。

構成ファイルを使用してプロジェクトを参照することも可能です。

vitest.workspace.ts

export default ['packages/*/vitest.config.{e2e,unit}.ts'];

このパターンでは、vitest.config ファイル名が e2e や unit を含み、拡張子の前に記述されているプロジェクトのみが対象となります。

WARNING

グロブパターンでファイル名を参照する場合は、構成ファイル名が vite.config または vitest.config で始まることを確認してください。そうでない場合、Vitest はそのファイルをスキップします。

インライン設定を使用してプロジェクトを定義することもできます。ワークスペースファイルは、両方の構文を同時に使用できます。

vitest.workspace.ts

import { defineWorkspace } from 'vitest/config';

// defineWorkspace は、型ヒントの DX (開発体験) を向上させます
export default defineWorkspace([
  'packages/*',
  {
    // 2 つの構成をマージするには "extends" を追加します
    extends: './vite.config.js',
    test: {
      include: ['tests/**/*.{browser}.test.{ts,js}'],
      // インライン構成を使用する場合は、名前を定義することを推奨します
      name: 'happy-dom',
      environment: 'happy-dom',
    },
  },
  {
    test: {
      include: ['tests/**/*.{node}.test.{ts,js}'],
      name: 'node',
      environment: 'node',
    },
  },
]);

WARNING

すべてのプロジェクトには一意の名前が必要です。そうでない場合、Vitest はエラーをスローします。インライン構成内で名前を指定しない場合、Vitest は自動的に番号を割り当てます。グロブ構文で定義されたプロジェクト構成内で名前を指定しない場合、Vitest はデフォルトでディレクトリ名を使用します。

インライン構成を使用しない場合は、ルートディレクトリにシンプルな JSON ファイルを作成するだけで済みます。

vitest.workspace.json

json

["packages/*"]

ワークスペースプロジェクトでは、すべての構成プロパティがサポートされているわけではありません。型安全性を高めるためには、プロジェクト構成ファイル内で defineConfig メソッドの代わりに defineProject を使用してください。

packages/a/vitest.config.ts

import { defineProject } from 'vitest/config';

export default defineProject({
  test: {
    environment: 'jsdom',
    // "reporters" はプロジェクト構成ではサポートされていないため、
    // エラーが表示されます
    reporters: ['json'],
  },
});

テストの実行

ワークスペース内でテストを実行するには、ルートディレクトリの package.json にスクリプトを定義します。

json

{
  "scripts": {
    "test": "vitest"
  }
}

これで、パッケージマネージャーを使用してテストを実行できます。

npmyarnpnpmbun

bash

npm run test

bash

yarn test

bash

pnpm run test

bash

bun test

特定のプロジェクト内でのみテストを実行する必要がある場合は、--project CLI オプションを使用してください。

bash

npm run test --project e2e

TIP

CLI オプション --project は、複数のプロジェクトをフィルタリングするために複数回使用できます。

bash

npm run test --project e2e --project unit

構成

構成オプションは、ルートレベルの構成ファイルからは継承されません。共有構成ファイルを作成し、プロジェクト構成とマージすることができます。

packages/a/vitest.config.ts

import { defineProject, mergeConfig } from 'vitest/config';
import configShared from '../vitest.shared.js';

export default mergeConfig(
  configShared,
  defineProject({
    test: {
      environment: 'jsdom',
    },
  })
);

また、構成オプションの一部は、プロジェクト構成では許可されていません。主なものは次のとおりです。

coverage: カバレッジはワークスペース全体に対して実行されます
reporters: ルートレベルのレポーターのみがサポートされます
resolveSnapshotPath: ルートレベルのリゾルバーのみが適用されます
テストランナーに影響を与えないその他すべてのオプション

TIP

プロジェクト構成内でサポートされていないすべての構成オプションには、"Config" ページの横に * 記号が付いています。

カバレッジ

ワークスペースプロジェクトのカバレッジは、すぐに利用できます。ただし、all オプションを有効にしており、一部のプロジェクトで標準外の拡張子を使用している場合は注意が必要です。ルート構成ファイルに、その拡張子を処理できるプラグインが必要になります。

たとえば、Vue ファイルを使用するパッケージがあり、独自の構成ファイルを持っているとします。しかし、一部のファイルがテストでインポートされていない場合、カバレッジは失敗する可能性があります。これは、未使用ファイルの分析時に、プロジェクト構成ではなくルート構成が参照されるためです。

ワークスペース ​