在 create-react-app 上运行构建后的空白页面

Question

尝试在 netlify 上部署 create-react-app，但是我的构建是空白页。我正在使用 .env 文件来加载 firebase api 密钥是构建的问题吗？

即使我试图在我的计算机上本地打开它，它的空白页面也会在控制台中输出错误：“源文件加载失败：///event-app/static/js/main.108757a0.js”

package.json： https ://gist.github.com/Verthon/f82371ad2bb636b2e95c5b7697aa0bb5

 ➜  event-app git:(master) ✗ npm run build

> event-app@0.1.0 build /home/jurr/Projects/event-app
> node scripts/build.js

Creating an optimized production build...
Compiled with warnings.

./src/components/Router.js
  Line 12:  'withFirebase' is defined but never used  no-unused-vars

./src/components/Firebase.js
  Line 21:  'Firebase' is defined but never used  no-unused-vars

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

File sizes after gzip:

  282.86 KB  build/static/js/main.108757a0.js
  3.1 KB     build/static/css/main.8e671453.css

原文由 Verthon 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我通过设置解决了这个问题

"homepage": "."

在 package.json 根据 这个文档

原文由 Verthon 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

如果您正在使用 react-router 并尝试直接在浏览器中打开 index.html （或使用 electron，它基本上是这样做的），除了设置 homepage 其他人建议，将您的 BrowserRouter 替换为 HashRouter 。

---

我正在尝试使用 create-react-app 构建一个电子应用程序。在开发中运行时一切都很好，但是当我构建 CRA 然后将电子应用程序指向 index.html 文件时，我得到了空白页。

我发现这与直接在浏览器中打开 index.html 文件完全一样。每个人都说“在 homepage 中设置 --- package.json ”，但我已经知道了。所以现在怎么办！？

我最终发现问题是 react-router 。我使用的是 BrowserRouter 。切换到 HashRouter 为我解决了这个问题。

原文由 Zach Olivare 发布，翻译遵循 CC BY-SA 4.0 许可协议