Closed14

【解決】Next.jsをVercelにデプロイするとサイトが表示できなくなる

概要

ローカルでは、yarn buildした場合には全く問題なく動くのに、Vercelにデプロイした場合にはコンソールに5000件以上のエラーが出る。なんでや

いつおきるのか

Vercelにデプロイした場合に、アプリケーションにアクセスするとコンソールに多くのエラーが出る。
ただし /api/hello にアクセスした場合には、問題なく表示されるため、ビルドには成功していると考えられる。

  • デプロイしたときでもビルド時にはエラーは発生しない
  • ローカル(vercel dev / yarn build / yarn start)が可能

動作についてはこちら:

https://www.notion.so/monocraft/75aadc06113348b59d40cc51acd498e9#3b7a3a20bbcc40a98ec388e394576b40
  • dependencies

    "dependencies": {
      "dayjs": "^1.9.4",
      "firebase": "^7.24.0",
      "lodash": "^4.17.20",
      "next": "^10.0.0",
      "next-localization": "^0.9.3",
      "react": "17.0.0",
      "react-dom": "17.0.0",
      "react-infinite-scroll-component": "^5.1.0",
      "react-markdown": "^5.0.2",
      "react-modal": "^3.11.2",
      "react-select": "^3.1.0",
      "recoil": "^0.1.2"
    },
    "devDependencies": {
      "@types/node": "^14.14.2",
      "@types/react": "^16.9.53",
      "babel-plugin-inline-react-svg": "^1.1.1",
      "node-sass": "^4.14.1",
      "styled-jsx-plugin-sass": "^1.0.0",
      "typescript": "^4.0.3"
    }
    

nvmで12系使ってるので、全く問題ないですね...

1 Recoil削除

該当するコードと依存関係をすべて削除してみた

→解消されず

2 Firebaseの処理書き直し

→Firebase Adminつかって処理書きますか...

Going Serverless with Next.js and Firebase

→だめでした😭😭😭😭😭

Firebase外したらエラーは解消される感じですか?
以前Next.js + VercelでCookieをオフにしてみたときに同じ感じ(一度ページが表示される→エラーが発生する→ページが表示されなくなる)でバグることがありました。

Vercelの公式サイトでも同じようにバグったので諦めてしまい原因は未だに分かっていないのですが、それと近い部分でエラーが発生していそうな・・・

Firebaseを外してもエラーは継続して出ますね...

クライアント側の全体処理部分を気にしつつ、発生箇所の特定進めてみます!😩

3 yarn.lock再生成

→ダメでした

4 プロジェクト作り直し→移植→デプロイ

→ダメでした

[現在📌] 5 コードの書き方に問題?

ドツボにはまっています😔😔

🎉🎉解決しました!

yarn create next-app で作成したアプリをそのままデプロイしたところ、同様なエラーが発生したため、Next.jsのissuesを確認したところ、このような投稿が

https://github.com/vercel/next.js/issues/19001

JSX transformを使用し、環境変数を NODE_ENV=development と指定している場合、
TypeError: Object(...) is not a function
と、同じエラーが発生しているようです。

今回は、Nuxt.jsからNext.jsへリプレイスしていたため、ブランチで分け、Vercelでは、ステージング環境に対して、環境変数を指定していました。

環境変数"NODE_ENV"を削除することで、正常にアプリが動作するようになりました🎉🎉🎉
よかったー!!

スクラップに助言いただいた、catnoseさん、Genbuchanさん、ありがとうございました😆😆

解決したようで良かったです!
あー、なるほどです。参考になりました!

このスクラップは2020/11/24にクローズされました
ログインするとコメントできます