use-vite

ビルドシステムとして Vite、テストツールとして Vitest を使用します。

ESM の設定

vite.config.js では ESM 構文を使用します。すべての *.js ファイルが ESM として解釈されるよう、package.json に "type": "module" を追加します。CJS のままにする必要があるファイルには、.cjs 拡張子を使用します。

Vite の Node API の CJS ビルドは使用しないでください。非推奨となっており、Vite 6 で削除されています。参考：https://vite.dev/guide/troubleshooting.html#vite-cjs-node-api-deprecated

vite-plugin-checker

ビルドと並行して TypeScript の型チェックを実行するため、vite-plugin-checker を追加します。

1. インストールします。

pnpm add --save-dev vite-plugin-checker

2. vite.config.js に追加します。

import { defineConfig } from 'vite';
import checker from 'vite-plugin-checker';

export default defineConfig({
  plugins: [
    checker({
      typescript: true,
    }),
  ],
});

開発中は、型エラーがブラウザーのオーバーレイとターミナルに表示されます。TypeScript のエラーがあるとビルドは失敗するため、型チェック用の個別のスクリプトは不要です。