typescript - Next.jsでnext-env.d.tsファイルをどのように使いますか？

Next.js の TypeScript プロジェクトで next-env.d.ts というファイルに気付きました。プロジェクト全体で使えるいくつかの enum を宣言したいです。これをどのように行い、そしてプロジェクト全体でこれらの enum にアクセスするにはどうすればよいですか？

回答 #1

next-env.d.ts ファイルの説明はこちら: https://nextjs.org/docs/basic-features/typescript

next-env.d.tsという名前のファイルがプロジェクトのルートに作成されます。このファイルは、Next.jsの型情報がTypeScriptコンパイラによって認識されることを保証します。削除することはできませんが、編集することは可能です（ただし、編集する必要はありません）。

列挙型で達成しようとしていることについては、列挙型を通常のESモジュールとしてエクスポートできるので、コード内でいつでもインポートできます。

役に立てば幸いです。

回答 #2

Next 11 以降では、next-env.d.ts ファイルの推奨事項が変更されました。これは、ビルドごとに再生成されるためです。

それを編集すべきではなく、代わりに自分の型用の新しいファイルを作成し、それを tsconfig.json の include に追加するべきです。

しかし、列挙型の場合はそれらは必要ありません。通常の .ts ファイルで宣言し、通常通りインポートすればよいです。

出典（古いドキュメントでは、次の注記がv13.4.5以降のドキュメントから明らかに削除されています）：https://github.com/vercel/next.js/blob/v13.4.4/docs/basic-features/typescript.md#existing-projects :

next-env.d.ts という名前のファイルがプロジェクトのルートに作成されます。このファイルは、TypeScript コンパイラーが Next.js の型を認識できるようにするものです。このファイルを削除したり編集したりしてはいけません。内容はいつでも変更される可能性があります。このファイルはコミットすべきではなく、バージョン管理に含めず（例えば .gitignore に追加して）無視する必要があります。

next-env.d.ts を編集する代わりに、additional.d.ts のような新しいファイルを追加し、それを tsconfig.json の include 配列で参照することで、追加の型を含めることができます。

参照: https://github.com/vercel/next.js/issues/26533