React Hooks 不適用於 Firebase 雲函數錯誤：不變違規：無效的鈎子調用

Question

我正在使用 Firebase Cloud Functions 來托管我的 SSR Nextjs 應用程序。 我可以在 firebase 雲函數上部署 Nextjs 應用程序，並在沒有 React Hooks 的情況下使用干凈的 URL 訪問它，但使用 React Hooks 我收到一條錯誤消息：

Invariant Violation: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

GitHub firebase/firebase-functions repo 上也報告了此問題。

還有一個可重現的示例 repo來測試錯誤（在pages/about.tsx文件中實現的 useState 掛鈎）。

這是在 React: 16.10.2 上完成的

Answer 1

問題表面上源於反應源代碼的兩個副本。 我不是 100% 確定它是如何工作的，所以我什至不會嘗試解釋問題的根本原因。

要解決此問題，請將應用程序放在功能文件夾中並刪除 package.json。 不幸的是，應用程序的所有依賴項都必須是函數的依賴項。 然后，將next.config.js更改為：

'use strict';

module.exports = { distDir: './next' };

和index.js到這個：

const dir = __dirname + "/app" const app = next({ dev, dir, conf: {distDir: 'next'} })