Node/React 应用程序不会部署到 Heroku答案

【问题标题】：Node/React app won't deploy to HerokuNode/React 应用程序不会部署到 Heroku
【发布时间】：2017-11-27 00:56:41
【问题描述】：

我的应用有一个 React 前端和一个 Node 后端； BE 通过 API 提供 FE 数据。它不会部署到 Heroku——堆栈跟踪如下。

我尝试过的事情：

This question。我已经尝试在答案中提到的模型存储库之后对我的 package.json 文件进行建模，但没有运气。
部署上述模型存储库，效果很好。
将模型存储库部署到我自己失败的 heroku 应用程序中 - 它运行良好，因此 Heroku 不是问题。
This question（我已经检查过 react-scripts 被列为依赖项而不是开发依赖项）。

我可能最终会以模型存储库为起点，并逐步复制我的项目，但如果您能提供任何有关可能出现问题的信息，我将不胜感激。

堆栈跟踪：

> fsevents@1.0.17 install /tmp/build_f03b382a2b768aeb89ff9c197145d0a5/client/node_modules/fsevents
> node-pre-gyp install --fallback-to-build

node-pre-gyp ERR! Tried to download(404): https://fsevents-binaries.s3-us-west-2.amazonaws.com/v1.0.17/fse-v1.0.17-node-v48-linux-x64.tar.gz
node-pre-gyp ERR! Pre-built binaries not found for fsevents@1.0.17 and node@6.10.3 (node-v48 ABI) (falling back to source compile with node-gyp)
make: Entering directory '/tmp/build_f03b382a2b768aeb89ff9c197145d0a5/client/node_modules/fsevents/build'
SOLINK_MODULE(target) Release/obj.target/.node
COPY Release/.node
make: Leaving directory '/tmp/build_f03b382a2b768aeb89ff9c197145d0a5/client/node_modules/fsevents/build'

> fibers@1.0.15 install /tmp/build_f03b382a2b768aeb89ff9c197145d0a5/client/node_modules/fibers
> node build.js || nodejs build.js

`linux-x64-48` exists; testing
Binary is fine; exiting
added 1242 packages in 52.433s
removed 1242 packages in 25.561s

> react-ui@0.1.0 build /tmp/build_f03b382a2b768aeb89ff9c197145d0a5/client
> react-scripts build

sh: 1: react-scripts: not found
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! react-ui@0.1.0 build: `react-scripts build`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the react-ui@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

我的服务器 package.json：

{
  "name": "in-search-of-happiness",
  "engines": {
    "node": "6.10.x"
  },
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www",
    "heroku-postbuild": "cd client/ && npm install --only=dev && npm install && npm run build"
  },
  "cacheDirectories": [
    "node_modules",
    "client/node_modules"
  ],
  "dependencies": {
    "body-parser": "^1.17.2",
    "cookie-parser": "^1.4.3",
    "debug": "~2.6.3",
    "express": "~4.15.2",
    "jade": "^1.11.0",
    "mongoose": "^4.10.8",
    "morgan": "^1.8.2",
    "serve-favicon": "^2.4.3",
    "zombie": "^5.0.5"
  }
}

我的 React package.json：

{
  "name": "react-ui",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "bootstrap": "^3.3.7",
    "fetch": "^1.1.0",
    "node-fetch": "^1.7.1",
    "process-nextick-args": "^1.0.7",
    "react": "^15.6.1",
    "react-bootstrap": "^0.31.0",
    "react-dom": "^15.6.1",
    "react-scripts": "1.0.7",
    "util-deprecate": "^1.0.2"
  },
  "devDependencies": {
    "chai": "^4.0.2",
    "eslint": "^4.0.0",
    "sinon": "^2.3.5",
    "wdio-mocha-framework": "^0.5.10",
    "webdriverio": "^4.8.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "proxy": "http://localhost:3001"
}

【问题讨论】：

你最终找到解决方案了吗？
嗨@ViceSallés，如果我没记错的话，同事的节点配置损坏了 package-lock.json 文件。正如我在问题中提到的那样，我们最终将代码复制到模型存储库中。

标签： node.js reactjs express heroku

【解决方案1】：

您好，您的后期构建脚本需要修改，请遵循此约定

将 reactFolderName 替换为包含 react 前端的文件夹名称将下面的 sn-p 添加到脚本下的 package.json 中

    scripts{
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix reactFolderName && npm run build --prefix reactFolderName"
}

并将这个 sn-p 添加到您的 index.js 文件中

    app = express()
    app.use(express.static('reactFolderName/build'));
    app.get('*', (req, res) => res.sendFile(path.resolve(__dirname, 'reactFolderName', 'build', 'index.html')));

【讨论】：