使用 React 迁移 Heroku 到 AWS答案

【问题标题】：Heroku to AWS migration using React使用 React 迁移 Heroku 到 AWS
【发布时间】：2019-09-04 18:00:00
【问题描述】：

我有一个功能正常的 React Web 应用程序，它部署在 Heroku 上。我正在尝试将整个应用程序迁移到 AWS，但遇到了一些麻烦。我首先尝试创建一个 EC2 实例并在那里克隆我的 github 存储库。我无法让它工作。我认为这是因为只有服务器端代码应该添加到 EC2 实例而不是客户端。

我现在正在尝试使用 Elastic Beanstalk 上传我的代码（服务器和客户端）。这个过程看起来很简单，但是当我上传我的 .zip 文件并进行部署时，我在事件日志中收到以下错误：

未能找到 package.json。 Node.js 启动时可能会出现问题。验证 package.json 是否有效或将代码放在名为 server.js 或 app.js 的文件中。

我的 zip 文件夹中有一个 package.json 文件，所以我真的不确定这里发生了什么。对此的任何建议都会有所帮助。

这是我package.json的内容：

{
  "name": "beer",
  "version": "0.1.0",
  "private": true,
  "proxy": "http://localhost:5000",
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.12",
    "@fortawesome/free-solid-svg-icons": "^5.6.3",
    "@fortawesome/react-fontawesome": "^0.1.3",
    "@material-ui/core": "^3.8.1",
    "@material-ui/icons": "^3.0.1",
    "aws-sdk": "^2.422.0",
    "axios": "^0.18.0",
    "bcrypt": "^3.0.4",
    "body-parser": "^1.18.3",
    "cookie-session": "^2.0.0-beta.3",
    "dotenv": "^4.0.0",
    "express": "^4.16.4",
    "material-ui-rating": "^2.0.0",
    "passport": "^0.4.0",
    "passport-local": "^1.0.0",
    "pg": "^7.8.0",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-redux": "^6.0.0",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.2",
    "redux": "^4.0.1",
    "redux-logger": "^3.0.6",
    "redux-saga": "^0.16.2",
    "session-middleware": "^1.0.2",
    "sweetalert": "^2.1.2"
  },
  "scripts": {
    "start": "node server/server.js",
    "client": "react-scripts start",
    "server": "nodemon --watch server server/server.js",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

还有我的 zip 里面的文件结构：

--beer
  -build
  -nodemodules
  -package.json
  -public
    -index.html
    -manifest.json
  -server
    -server.js
    -modules
    -routes
  -src
    -index.js
    -components
      -App
        -App.js
      -redux
        -reducers
          -index.js
        -sagas
          index.js

【问题讨论】：

package.json 在您的 zip 文件夹的根目录中吗？
@Chris 我不确定。我没有根文件夹，但我确实尝试模仿 Elastic Beanstalk Demo 文件夹的格式。 package.json 位于主文件夹中。
根文件夹是您项目的“顶级文件夹”。如果这就是“主文件夹”的意思，我想我们说的是同一件事。请edit您的问题并添加您的package.json的内容。
@Chris 我已经编辑了我的帖子以包含我的 package.json 的内容
Hrm，这看起来有效。部署输出中是否还有其他有趣的消息？

标签： reactjs amazon-web-services heroku amazon-elastic-beanstalk

【解决方案1】：

使用 zip 文件部署到 Elastic Beanstalk 时，您必须确保您的 zip doesn't contain a top-level container directory.在您的情况下，您的 beer/ 目录不能包含在内。

在 macOS 或 Windows 上，您可以select the contents of your beer/ directory and compress them。如果您上传没有顶级目录的新 zip，Elastic Beanstalk 应该能够找到您的 package.json 文件并正确部署您的应用程序。

【讨论】：