Heroku:傀儡，铬:加载共享库时出错: libX11-xcb.so.1

Question

在向Heroku部署带有react-snap的应用程序时，我会遇到以下错误。

puppeteer/.local-chromium/linux-686378/chrome-linux/chrome: error while loading shared libraries: libX11-xcb.so.1: cannot open shared object file: No such file or directory

我应用了所有的更改，设置了所有的构建包。

我甚至可以在没有"postbuild": "react-snap"行的情况下对第一个部署做出反应，它可以工作。

但是，如果在这里加上一行，就会再次失败。现在怎么办？

"reactSnap": {
    "cacheAjaxRequests": true,
    "inlineCss": true,
    "http2PushManifest": true,
    "puppeteerArgs": ["--no-sandbox", "--disable-setuid-sandbox"]
  }

"postbuild": "react-snap"

Answer 1

我在这个问题上挣扎了4个小时。谷歌搜索了很多解决方案，但没有人为我工作。我终于拿到了！(其实现在就在这个时候)

Heroku日志：

> individual-claims@0.1.0 postbuild /tmp/build\_3cc3bffa\_ > react-snap ✅ crawled 1 out of 1 (/)

完成了！我很高兴。

解决方案：

https://github.com/jontewks/puppeteer-heroku-buildpack.git

1. 转到Heroku设置-> buildpack -> Add buildpack
2. Add：

重要的是！确保这是第一个。，这是常见的错误。当在Heroku上作出反应时，您(我想)已经有了https://github.com/mars/create-react-app-buildpack.git，但是React buildpack应该是第二个。没人这么说。

1. 重新部署并玩得开心。

注意:在经历了很多困难之后，我对我的应用程序做了一些修改(不过，我不认为这真的很重要)

package.json中的

     "engines": {
          "node": ">=14.12.0",  // Just to make sure I have the latest and the greatest 
          "npm": ">=6.14.8"
        },
  
   "devDependencies": {
        ...
       "prettier": "^2.1.2",   // Just to make sure I have the latest and the greatest 
        ...
   }

1. Heroku堆栈: heroku-18 .这是默认的，除非您的应用程序是旧的，否则您可以使用它。

1. 我没有这几行：

"cacheAjaxRequests": true,
"inlineCss": true,
"http2PushManifest": true,

我听说过"inlineCss"：没错，可能会引起问题