时间戳

首页 > 解决方案 > 部署生产构建时 React App 空白页面

reactjs - 部署生产构建时 React App 空白页面

问题描述

我是新来的反应，所以如果这是基本的道歉 - 但是按照一个有希望的学习曲线来构建网站，我已经花了 c9hrs 试图让它部署:(

信息如下...

1.在我的机器上作为开发版本运行良好。

2.通过'npm run build'创建一个生产版本会导致它在假设它托管在服务器根目录的情况下被构建 - 见下文；

file sizes after gzip:

  278.93 KB  build/static/js/2.a3ca1e82.chunk.js
  42.16 KB   build/static/js/main.1a0b5ce7.chunk.js
  33.88 KB   build/static/css/main.75362cf6.chunk.css
  24.72 KB   build/static/css/2.3cd6815b.chunk.css
  762 B      build/static/js/runtime~main.a8a9905a.js

The project was built assuming it is hosted at the server root.
You can control this with the homepage field in your package.json.
For example, add this to build it for GitHub Pages:

  "homepage" : "http://myname.github.io/myapp",

The build folder is ready to be deployed.
You may serve it with a static server:

  serve -s build

运行 'serve -s build' 会导致在 localhost:5000 上本地部署生产版本 - 但出现黑屏问题

...并且问题在 Amazon S3 上的生产部署中是一致的。现在可以在 www.cotswoldcohost.co.uk上看到这一点。

查看源代码，它似乎正在查找 index.html，并且控制台突出显示了particle.js 的类型错误——这可能是与渲染问题不同的问题。

任何建议都非常感谢 - 很高兴提供您可能需要的更多信息！

标签： reactjs

解决方案

当我在 Chrome 上访问www.cotswoldcohost.co.uk时，我的控制台给了我Uncaught TypeError: Super expression must either be null or a function.

如果这是真正的潜在问题而不是 Particle.js 问题，那么它可能是您的应用程序中的导出问题。我会检查这些东西：

  1. 循环依赖/导入
  2. 错误地导入默认导出（通常是带有不应使用大括号的大括号的导入）
  3. 缺失的import陈述

推荐阅读