在 Heroku 上托管 React App 的问题

Question

我正在尝试在 heroku 中托管 React 应用程序...

我已经使用 create-react-app 创建了应用程序..并按照以下方法进行托管...

        git init
        heroku create $APP_NAME --buildpack https://github.com/mars/create-react-app-buildpack.git
        git add .
        git commit -m "Start with create-react-app"
        git push heroku master
        heroku open

但是当我尝试将应用程序推送到 heroku 时 returns 出现以下错误...

      remote:   - htmlparser.js:235 new HTMLParser
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[html-minifier]/src/htmlparser.js:2    35:13
      remote:   
      remote:   - htmlminifier.js:946 minify
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[html-minifier]/src/htmlminifier.js    :946:3
      remote:   
      remote:   - htmlminifier.js:1299 exports.minify
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[html-minifier]/src/htmlminifier.js    :1299:10
      remote:   
      remote:   - index.js:296 
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[html-webpack-plugin]/index.js:296:    16
      remote:   
      remote:   - util.js:16 tryCatcher
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/util.js:16:23  
      remote:   - promise.js:512 Promise._settlePromiseFromHandler
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/promise.js:51    2:31
      remote:   
      remote:   - promise.js:569 Promise._settlePromise
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/promise.js:56    9:18
      remote:   
      remote:   - promise.js:614 Promise._settlePromise0
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/promise.js:61    4:10
      remote:   
      remote:   - promise.js:693 Promise._settlePromises
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/promise.js:69    3:18
      remote:   
      remote:   - async.js:133 Async._drainQueue
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/async.js:133:    16
      remote:   
      remote:   - async.js:143 Async._drainQueues
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/async.js:143:    10
      remote:   
      remote:   - async.js:17 Immediate.Async.drainQueues
      remote:     [build_4acd980d8a80e0486da141a82d0b3cee]/[bluebird]/js/release/async.js:17:1    4

我该如何解决这个问题？

Answer 1

我刚刚克隆了您的存储库并尝试了 npm install + npm run build。我发现 npm run build 在本地失败。所以，这是代码错误，而不是 Heroku 部署错误。

失败来自 HTMLParser，所以我查看了 public/index.html 并找到了一个高度自定义的模板。

为了检查 public/index.html 内容是否有问题，我将其替换为默认的 create-react-app HTML 模板代码。然后，npm run build成功完成。

因此，似乎 您的 public/index.html 中 HTML 的有效性存在问题，这会破坏 create-react-app 的模板引擎。我建议运行通过 HTML validator 来查找问题，或者手动将模板分解成更小的可测试部分，直到找到导致构建错误的部分。

在 Heroku 上托管 React App 的问题

Issue in Hosting React App on Heroku

heroku

heroku-toolbelt

reactjs

create-react-app

heroku-cli