4

My app has a React frontend and a Node backend; the BE serves the FE data through an API. It won't deploy to Heroku—stack trace is below.

Things I've tried:

  1. This question. I've tried modelling my package.json files after a model repo mentioned in the answer, but no luck.
  2. Deploying the model repo mentioned above—it worked fine.
  3. Deploying the model repo to my own failing heroku app—it worked fine, so Heroku isn't the issue.
  4. This question (I've checked react-scripts is listed as a dependency and not a dev-dependency).

I will probably end up taking the model repo as a starting point and gradually copying my project over, but would appreciate any info on what might be going wrong.

Stack Trace:

> [email protected] 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 [email protected] and [email protected] (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'

> [email protected] 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

> [email protected] 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! [email protected] build: `react-scripts build`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

My server 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"
  }
}

My 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"
}
2
  • Did you eventually come out with a solution? Commented Jan 29, 2018 at 7:54
  • 1
    Hi @ViceSallés, if I remember correctly, a coworker's node configuration had corruped the package-lock.json file. We ended up copying the code to the model repo, as I mentioned in the question. Commented Jan 29, 2018 at 16:58

1 Answer 1

0

Hello your post build script needs some modification, kindly follow this convention

Replace reactFolderName to your folder name that contains the react frontend Add This below snippet to your package.json under the scripts

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

And add this snippet to your index.js file

    app = express()
    app.use(express.static('reactFolderName/build'));
    app.get('*', (req, res) => res.sendFile(path.resolve(__dirname, 'reactFolderName', 'build', 'index.html')));
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.