Next.jsで作ったアプリをvercelにデプロイする時のエラー対応

Next.jsデータをvercelにデプロイする時のエラー解消の忘備録。

前提

Next.jsで作ったアプリをvercelにデプロイしようとしたところ下記のエラーで進まなくなってしまった。

Build optimization failed: found page without a React Component as default export in
pages/config/firebase
See https://nextjs.org/docs/messages/page-without-valid-component for more info.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Error: Command "yarn run build" exited with 1

要約すると、コンポーネントが見つからないという内容のようだ。（この場合はpages>config>firebaseが見つからない。）

結論

Next.jsではディレクトリ構造によってルーティングが決まるという性質があるらしく、'pages'ディレクトリ内には原則的にページの表示内容のファイルのみを置く必要がある。（'api'ファイルは例外。）
そのため今回はfirebaseの設定ファイルである'config'ディレクトリを'pages'内に作ってしまったことでエラーになった。

解消方法

'config'ディレクトリを'pages'ディレクトリの外に移動させることで解消できた。
'src'ディレクトリを新たに作成し、その中に'pages'と'config'を入れる形でも良い。
　src/
　├config/
　｜　└firebase.js
　└pages/
　　　└index.js