CODEWITHSUNDEEP
node.jsreactjsnpmbuildconcurrently
Michael Nelles
Michael Nelles

Reputation: 6002

NPM run build with React + Node + concurrently How to?

I have spend hours trying to figure this out any advice is welcome. The objective here is to assemble a postbuild script that will work on a nodeJS app running a react client.

React is on post 3000 and node is on 5000. So it requires the concurrently library. Below are two attempts do-postbuild and heroku-postbuild (both fail).

  "scripts": {

    "server": "nodemon server.js --ignore client",
    "client": "npm start --prefix ../client",
    "dev": "concurrently \"npm run server\" \"npm run client\" ",
    "do-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix && npm run build --prefix client",
    "heroku-postbuild": "cd ../client && npm install && npm install --only=dev --no-shrinkwrap && npm run build" 
  },

folder structure

client
server
   |_package.json (above)
   |_server.js

npm run dev - WORKS perfectly

When I attempt npm run heroku-postbuild it yields the following:

npm ERR! errno 1
npm ERR! [email protected] heroku-postbuild: `cd client && npm install && npm install --only=dev --no-shrinkwrap && npm run build`
npm ERR! Exit status 1

When attempting to write npm run do-postbuild it throws an error like it is searching for client in the server folder

npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/Users/sites/server/client/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent

Upvotes: 2

Views: 4613

Answers (3)

Surisetty Pavan Kumar
Surisetty Pavan Kumar

Reputation: 1

Add this in your scripts

 "client-install": "npm install --prefix client",

Upvotes: 0

Surisetty Pavan Kumar
Surisetty Pavan Kumar

Reputation: 1

Please add below Scripts and try, it will work 100%.

 "scripts": { 

 "client-install": "npm install --prefix client",
      "start": "node server.js",
      "server": "nodemon server.js",
      "client": "npm start --prefix client",
      "dev": "concurrently \"npm run server\" \"npm run client\"",
      "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
    }

Upvotes: 0

Michael Nelles
Michael Nelles

Reputation: 6002

This is not a HEROKU solution it is for general UBUNTU server with root access.

Solution here is you don't have to dockerize the app as a bundle (client and server together).

What worked for me was to treat the client and server as two different apps.

Client side:

  • npm run build locally from the same folder as contains your package.json file
  • then post the app build folder as very straight forward client side app with HTML CSS Javascript

Server side:

  • upload the server files (not including node_modules folder)
  • run npm i(from the folder with the package.json file)
  • I set up reverse proxy to map the port to a specific location on the server for the react to reach it
  • set up cron job to start server side (and check periodically to ensure it is running)

Thats it - works perfect.

Upvotes: 3

Related Questions