pageExtensions

Next.js が使用するデフォルトのページ拡張子 (.tsx, .ts, .jsx, .js) を拡張できます。next.config.js 内で pageExtensions 設定を追加します:

next.config.js
module.exports = {
  pageExtensions: ['mdx', 'md', 'jsx', 'js', 'tsx', 'ts'],
}

これらの値を変更すると、以下のような すべての Next.js ページに影響します:

例えば、.ts ページ拡張子を .page.ts に再設定する場合、middleware.page.tsinstrumentation.page.ts_app.page.ts のようにページ名を変更する必要があります。

pages ディレクトリに非ページファイルを含める

テストファイルやコンポーネントで使用する他のファイルを pages ディレクトリに同居させることができます。next.config.js 内で pageExtensions 設定を追加します:

next.config.js
module.exports = {
  pageExtensions: ['page.tsx', 'page.ts', 'page.jsx', 'page.js'],
}

その後、ページのファイル拡張子に .page を含むように名前を変更します(例: MyPage.tsxMyPage.page.tsx にリネーム)。上記で言及したファイルを含む すべての Next.js ページをリネームするようにしてください。

On this page