Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 7 additions & 3 deletions guide/api-hmr.md
Original file line number Diff line number Diff line change
Expand Up @@ -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)`
Expand Down
2 changes: 0 additions & 2 deletions guide/env-and-mode.md
Original file line number Diff line number Diff line change
Expand Up @@ -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 の型を厳密にし、不明なキーを許可しないように
// できます。
Expand Down
28 changes: 17 additions & 11 deletions guide/features.md
Original file line number Diff line number Diff line change
Expand Up @@ -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]
{
Expand All @@ -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" />
```

:::

Expand All @@ -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" />
Expand Down