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.ts, instrumentation.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.tsx를 MyPage.page.tsx로 이름 변경). 위에서 언급한 파일들을 포함하여 모든 Next.js 페이지의 이름을 변경하세요.