feat(create-vite): set types compiler option in tsconfigs (#2166)

Author: jay-es

guide/api-hmr.md

@@ -62,10 +62,14 @@ if (import.meta.hot) {
 
 ## TypeScript の IntelliSense
 
-Vite は `import.meta.hot` の型定義を [`vite/client.d.ts`](https://github.com/vitejs/vite/blob/main/packages/vite/client.d.ts) で提供しています。`src` ディレクトリーに `vite-env.d.ts` を作成することで、TypeScript が型定義を読み込むようになります:
+Vite は `import.meta.hot` の型定義を [`vite/client.d.ts`](https://github.com/vitejs/vite/blob/main/packages/vite/client.d.ts) で提供しています。`tsconfig.json` に "vite/client" を追加することで、TypeScript が型定義を読み込むようになります:
 
-```ts [vite-env.d.ts]
-/// <reference types="vite/client" />
+```json [tsconfig.json]
+{
+  "compilerOptions": {
+    "types": ["vite/client"]
+  }
+}
 ```
 
 ## `hot.accept(cb)`

guide/env-and-mode.md

@@ -117,8 +117,6 @@ VITE_BAR=bar
 この目的を達するには、`src` ディレクトリーに `vite-env.d.ts` を作成し、以下のように `ImportMetaEnv` を補ってください:
 
 ```typescript [vite-env.d.ts]
-/// <reference types="vite/client" />
-
 interface ViteTypeOptions {
   // この行を追加することで ImportMetaEnv の型を厳密にし、不明なキーを許可しないように
   // できます。

guide/features.md

@@ -113,15 +113,7 @@ Vite のスターターテンプレートでは依存関係の型チェックを
 
 ### クライアントでの型 {#client-types}
 
-Vite はデフォルトでは Node.js の API を提供します。Vite でクライアント用のコードを使用するには `d.ts` の定義ファイルを追加します:
-
-```typescript
-/// <reference types="vite/client" />
-```
-
-::: details `compilerOptions.types` の使用
-
-または、`tsconfig.json` 内の `compilerOptions.types` に `vite/client` を追加することもできます:
+Vite はデフォルトでは Node.js の API を提供します。Vite でクライアント用のコードを使用するには、`tsconfig.json` 内の `compilerOptions.types` に `vite/client` を追加できます:
 
 ```json [tsconfig.json]
 {
@@ -131,7 +123,15 @@ Vite はデフォルトでは Node.js の API を提供します。Vite でク
 }
 ```
 
-[`compilerOptions.types`](https://www.typescriptlang.org/tsconfig#types) が指定された場合、グローバルスコープには（見つかるすべての "@types" パッケージの代わりに）これらのパッケージのみが含まれるようになることに注意してください。
+[`compilerOptions.types`](https://www.typescriptlang.org/tsconfig#types) が指定された場合、グローバルスコープには（見つかるすべての "@types" パッケージの代わりに）これらのパッケージのみが含まれるようになることに注意してください。これは TS 5.9 以降で推奨されています。
+
+::: details triple-slash directive の使用
+
+または、`d.ts` の定義ファイルを追加することもできます:
+
+```typescript [vite-env.d.ts]
+/// <reference types="vite/client" />
+```
 
 :::
 
@@ -153,7 +153,13 @@ Vite はデフォルトでは Node.js の API を提供します。Vite でク
     export default content
   }
   ```
-- `vite/client` への参照を含むファイル（通常は `vite-env.d.ts`）:
+- `compilerOptions.types` を使用している場合は、ファイルが `tsconfig.json` に含まれるようにします:
+  ```json [tsconfig.json]
+  {
+    "include": ["src", "./vite-env-override.d.ts"]
+  }
+  ```
+- triple-slash directive を使用している場合は、`vite/client` への参照を含むファイル（通常は `vite-env.d.ts`）を更新します:
   ```ts
   /// <reference types="./vite-env-override.d.ts" />
   /// <reference types="vite/client" />