firebase + create-react-app 托管錯誤
[英]firebase + create-react-app hosting error
問題描述
我試圖在 Firebase 上部署我的 react SPA，但只有空白頁面出現這樣的控制台錯誤： “Uncaught SyntaxError: Unexpected token <”
為了排除第三方庫，我創建了新的 React-app 來部署。 並得到了完全相同的問題。
終端日志：
有人知道如何解決這個問題嗎？
鏈接到 Firebase 部署的 create-react-app 起始頁
來自 firebase.json 的代碼
{
"hosting": {
"public": "build",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"redirects": [
{
"source" : "*",
"destination" : "/index.html"
}
]
}
}
5 個解決方案
解決方案1
6 已采納 2018-08-15 14:10:19
您的 main.js 再次包含頁面 html 數據。 <!doctype html><html lang="en"><head>... 。
當瀏覽器加載 JS 文件並嘗試解釋它時，它失敗了，因為 HTML 顯然不是 javascript。 它試圖用“哦，我找到了一個 < 但這不是我所期望的”來傳達它的困惑。
您似乎已經為您的服務器配置了默認路由，並且每個請求都返回您的 index.html。
我在你的一張屏幕截圖中注意到，你對“將所有 url 重寫為 index.html ”說“是”——它正是這樣做的。 您不應該激活它，因為您的所有請求將始終返回index.html 。
請查看您的firebase.json文件。 您將在那里找到托管和路由的說明。
API 文檔在這里：
https://firebase.google.com/docs/hosting/full-config
您可能想要特別查看重定向數組，如下所示：
"redirects": [
{
"source" : "*",
"destination" : "/index.html"
}
]
在這里，您告訴服務器將所有流量重定向到/index.html 。 刪除重定向條目，重新部署，一切都會好起來的。
所以這個重定向部分很可能會解決這個問題：
{
"hosting": {
"public": "build",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"redirects": []
}
}
解決方案2
2 2018-08-20 07:53:45
謝謝大家的快速回復。 通過將"redirects":[]到 firebase.json 解決了問題，如下所示：
{
"hosting": {
"public": "build",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"redirects": [],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]
}
}
解決方案3
0 2019-05-24 11:10:01
100% 工作示例。
解決了 Firebase 中 React App Hosting 中的空白頁面錯誤。
你可以閱讀這個博客
在幾分鍾內托管您的 React Web 應用程序。
命令以錯誤的順序運行 =>
登錄
火力初始化
火力基地部署
npm 運行構建
命令以正確的順序運行 =>
登錄
火力初始化
npm 運行構建
火力基地部署
解決方案4
0 2020-09-04 18:24:18
我的解決方案是簡單地將 firebase.json 更改為使用 build 文件夾而不是 public：在此處輸入圖像描述
解決方案5
0 2021-07-12 16:10:50
如果您設置了屬性homepage ，這也可能是package.json文件中的一個問題
{
"name": "project-name",
"homepage": "https://project-url",
"version": "0.1.0",
}
要解決此問題，請刪除homepage屬性。
創建反應應用程序錯誤
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.