Next.js-タイプチェック付きの設定

next.config.jsの単純な型チェック

これは実際の記事ではありませんが、共有することが重要だと思うので、Next.jsのドキュメントの一部を再公開したものです。 next.config.jsのタイプの使用に関しては、この構成のTypescriptファイルの使用はいくつかのハックなしでは不可能であるため、Next.jsチームによる実際の公式サポートはありません。

バージョン10.2.3以降、次のコードスニペットがドキュメントで利用可能になり、型チェックの単純なバリアントが有効になります。 Typescriptを使用していますが、構成ファイルはプロジェクトのバンドラーによってトランスパイルされないことに注意してください。使用されている機能は、JSDocからの「@type」タグであり、JSファイルにタイプをインポートします。

// Add the following line at the top of the file:
// @ts-check

// Then for the config itself, import the types
// via '@type'-tag.

 /**
  * @type {import('next/dist/next-server/server/config').NextConfig}
  **/
 const nextConfig = {
   /* config options here */
 }

// End of file.
module.exports = nextConfig

もちろん、カスタムのTypescript-configとプリプロセッサのステップを設定して、自分で設定をJavascriptにトランスパイルすることもできます。しかし今のところ、プラグインプロバイダーによるTypescriptの実質的なサポートがないため、努力する価値はないと思います。したがって、結局のところ、基本構成のタイプになりますが、タイプのない他のすべてのプラグインには「any」が必要になります。