使用 Firebase 進行模擬時，React 應用程序會出現空白頁

Question

我有 Firebase 項目，在public中有多個文件夾。 其中一個初始化了 React 應用程序的文件夾。 所以，我的項目樹看起來像這樣。

firebase-project
\---public
    |---folder1
    |---folder2
    \---react-app
        |---build
        |---public

我在根文件夾中沒有build文件夾。 public文件夾由 Firebase 生成。

這是我的firebase.json ：

{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

當我在folder1和folder2運行firebase serve或firebase emulators:start ， index.html顯示正確，但沒有react-app 。 localhost:5000/react-app/build和localhost:5000/react-app/public顯示空白頁。

但是，如果您在public中提供react-app應用程序的路徑，它就可以工作。

"public": "public/react-app/build",

但在這種情況下，我無法導航到folder1和folder2路徑

我嘗試使用"rewrites"重定向到build路徑，但這也不起作用。 在public中提供react-app的直接路徑時，它可以正常工作。

我錯過了什么？

Answer 1

問題在於 Webpack 搜索資產的位置。 這並沒有錯。

你看，當 Webpack 創建構建（使用/static/js/%name%.chunk.js在 React 中npm run build ）時，在index.html文件中它指向 /static/js/name 之類的資產。 因為在firebase.json我的public指向public文件夾，它在根目錄中搜索static文件夾。 但是使用這種結構，資產位於/react-app/build/static/中。

一旦您指向正確的位置，一切都會正常進行。

我肯定需要重新安排我的結構，因為很多不必要的文件部署到 firebase。