0

本周我的电脑硬盘坏了，我将我的应用程序从我的存储库恢复到新的硬盘驱动器，安装了所有依赖项，但现在我的应用程序无法在部署下运行。它在本地运行良好，但在生产中它崩溃了。我在这里阅读了很多关于 SO 的文章和线程，我尝试过的一切都不能解决我的问题。我已经推送了我拥有的最后一个工作提交，但这也不起作用。我已经在 Heroku 上创建了一张支持票，到目前为止还没有得到他们的帮助。这是两天的尝试和挫折，所以现在我来这里寻求帮助。

错误：

2021-01-29T12:30:59.905820+00:00 app[web.1]: [34mℹ[39m [90m｢wds｣[39m: Project is running at http://172.17.191.58/
2021-01-29T12:30:59.906395+00:00 app[web.1]: [34mℹ[39m [90m｢wds｣[39m: webpack output is served from 
2021-01-29T12:30:59.906538+00:00 app[web.1]: [34mℹ[39m [90m｢wds｣[39m: Content not from webpack is served from /app/public
2021-01-29T12:30:59.906689+00:00 app[web.1]: [34mℹ[39m [90m｢wds｣[39m: 404s will fallback to /
2021-01-29T12:30:59.907032+00:00 app[web.1]: Starting the development server...
2021-01-29T12:30:59.907032+00:00 app[web.1]: 
2021-01-29T12:31:00.092835+00:00 heroku[web.1]: Process exited with status 0
2021-01-29T12:31:00.133082+00:00 heroku[web.1]: State changed from starting to crashed
2021-01-29T12:31:02.023244+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=www.myapp.com request_id=7bcd9236-6d02-4c9b-bf0c-7d18dce36830 fwd="187.65.182.161" dyno= connect= service= status=503 bytes= protocol=https

包.json

{
"name": "client",
"homepage": "/",
"version": "0.1.0",
"private": true,
"dependencies": {
    "@ctrl/tinycolor": "^3.1.6",
    "@date-io/moment": "^1.3.13",
    "@material-ui/core": "^4.9.4",
    "@material-ui/icons": "^4.4.3",
    "@material-ui/pickers": "^3.2.10",
    "@material-ui/styles": "^4.10.0",
    "@react-google-maps/api": "^1.8.6",
    "async": "^3.1.1",
    "axios": "^0.21.1",
    "babel-eslint": "^10.1.0",
    "bootstrap": "^4.3.1",
    "bootstrap-daterangepicker": "^3.0.5",
    "chart.js": "^2.9.4",
    "ckeditor": "^4.12.1",
    "ckeditor4": "^4.15.1",
    "clsx": "^1.1.1",
    "crypto-js": "^4.0.0",
    "eslint-config-react-app": "^6.0.0",
    "eslint-plugin-flowtype": "^5.2.0",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-react": "^7.21.5",
    "filestack-js": "^0.11.5",
    "firebase": "^7.24.0",
    "grapesjs": "^0.16.34",
    "grapesjs-blocks-flexbox": "^0.1.1",
    "grapesjs-lory-slider": "^0.1.5",
    "grapesjs-parser-postcss": "^0.1.1",
    "grapesjs-plugin-ckeditor": "0.0.10",
    "grapesjs-style-bg": "^1.0.3",
    "grapesjs-style-filter": "^0.1.3",
    "grapesjs-style-gradient": "^2.0.3",
    "grapick": "^0.1.9",
    "intro.js": "^3.1.0",
    "intro.js-react": "^0.2.0",
    "jimp": "^0.14.0",
    "jquery": "^3.5.1",
    "moment": "^2.25.3",
    "moment-timezone": "^0.5.32",
    "node-sass": "^4.14.1",
    "prop-types": "^15.7.2",
    "react": "^16.13.1",
    "react-beautiful-dnd": "^11.0.5",
    "react-bootstrap": "^1.4.0",
    "react-bootstrap-daterangepicker": "^4.1.0",
    "react-chartjs-2": "^2.11.1",
    "react-color": "^2.18.1",
    "react-cookie": "^4.0.1",
    "react-dom": "^16.9.0",
    "react-dropzone": "^10.2.1",
    "react-favicon": "0.0.17",
    "react-firebase-file-uploader": "^2.4.3",
    "react-firebaseui": "^4.1.0",
    "react-google-autocomplete": "^1.1.3",
    "react-helmet": "^6.1.0",
    "react-icons": "^4.1.0",
    "react-iframe": "^1.8.0",
    "react-input-mask": "^2.0.4",
    "react-instafeed": "^1.0.0",
    "react-meta-tags": "^0.7.4",
    "react-number-format": "^4.3.0",
    "react-redux": "^7.1.1",
    "react-redux-loading-bar": "^4.5.0",
    "react-router-dom": "^5.0.1",
    "react-scripts": "^3.4.3",
    "react-select": "^3.0.8",
    "react-toastify": "^5.4.1",
    "redux": "^4.0.4",
    "redux-persist": "^6.0.0",
    "redux-thunk": "^2.3.0",
    "spectrum-colorpicker": "^1.8.1",
    "tinycolor2": "^1.4.1",
    "wowjs": "^1.1.3"
},
"engines": {
    "node": "14.x",
    "npm": "6.x"
},
"scripts": {
    "start": "react-scripts start --env.ENVIRONMENT=production",
    "dev": "react-scripts start --env.ENVIRONMENT=development",
    "build": "set \"HTTPS=true\" && react-scripts build --env.ENVIRONMENT=production",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "postinstall": "patch-package",
    "deploy": "git push heroku master",
    "clean-cache": "heroku builds:cache:purge"
},
"eslintConfig": {
    "extends": "react-app"
},
"browserslist": {
    "production": [
    ">0.2%",
    "not dead",
    "not op_mini all"
    ],
    "development": [
    "last 1 chrome version",
    "last 1 firefox version",
    "last 1 safari version"
    ]
},
"devDependencies": {
    "eslint-plugin-react-hooks": "^2.5.0",
    "patch-package": "^6.2.2",
    "remote-redux-devtools": "^0.5.16"
}
}

节点和 NPM 版本：

user@beast$ npm -v
6.14.10
user@beast$ node -v
v14.15.4

在这一点上我没有想法。到目前为止，我已经向 Heroku 推送了 30 多个新版本，欢迎提出任何建议。

4

1 回答 1

0

好的，我得到它的工作！:)))))) 每次当我用尽想法并在这里发布问题时，即使经过几天的反复试验，我还是以某种方式找到了解决方案。

基本上我的解决方案是正确调试它。

使用@jonrsharpe建议从适当的服务器提供它，我尝试通过运行在本地运行它serve -s -d build，这给了我一个正确的错误详细信息。我在浏览器上出现乱码，服务器输出显示 TLS 握手错误 (HTTPS)，这是可以理解的，因为我在本地运行它。所以我所做的只是set \"HTTPS=true\"从package.json[scripts.build]和中删除package.json[scripts.start] : "serve -s build"。

我的决赛package.json：

{
    [...],

    "scripts": {
        "start": "serve -s build",
        "dev": "react-scripts start --env.ENVIRONMENT=development",
        "build": "react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject",
        "postinstall": "patch-package",
        "deploy": "git push heroku master",
        "clean-cache": "heroku builds:cache:purge -a myapp"
    },

    [...]
}

我发誓我曾尝试使用serve -s build. 我做了两件事不同，我certbot (LetsEncrypt)在本地安装（我打算在本地设置 SSL 证书以进一步调试它，但我在设置它时让它在生产服务器中工作。）另一件事是set \"HTTPS=true\"如前所述删除. 所以我不完全确定它做了什么。

我重新添加了set \"HTTPS=true\"，package.json但应用程序不再重定向到 HTTPS……但这很好而且很小，至少现在我可以部署它。

于 2021-01-29T15:11:55.027 回答