DEV Community: Hafiz Saifullah

How to use npm "concurrently" module in package.json file

Hafiz Saifullah — Thu, 23 Jul 2020 15:30:28 +0000

Hey I am following an online course for blockchain based cryptocurrency network. Repository for course is https://github.com/15Dkatz/cryptochain. in package.json file, dev script is as follow...
"dev": "npm run dev-client & npm run start-redis && cross-env ENV='development' nodemon index.js", which is to start both front-end (react) and back-end (epress) servers, by using npm run dev command in terminal. but for me it is running only front-end that is npm run dev-client, which means only first part of dev is running. To run both commands concurrently, I installed npm i concurrently module. But I am confusing about syntax of dev with concurrently. Suggest me what syntax should be used for above dev script along with concurrently. especially how cross-env ENV='development' can be concatenated???

Error: [nodemon] app crashed - waiting for file changes before starting...

Hafiz Saifullah — Wed, 22 Jul 2020 13:59:00 +0000

Hey...! I am facing above error while trying to run
npm run dev-client in 2nd instance of terminal, while in 1st instance of terminal, there is already running both front-end and back-end servers by using npm run dev command.

Complete error message is given below...

$ npm run dev-peer

> crypto@1.0.0 dev-peer C:\Users\Education Use\crypto
> cross-env GENERATE_PEER_PORT='true' ENV='development' nodemon index.js   

[nodemon] 2.0.4
[nodemon] to restart at any time, enter `rs`
[nodemon] watching path(s): *.*
[nodemon] watching extensions: js,mjs,json
[nodemon] starting `node index.js`
listening at localhost: 3847
replace transaction pool map on a sync with {}
undefined:1
<!doctype html>
^

SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at Request._callback (C:\Users\Education Use\crypto\index.js:95:36)    
    at Request.self.callback (C:\Users\Education Use\crypto\node_modules\request\request.js:185:22)
    at Request.emit (events.js:315:20)
    at Request.<anonymous> (C:\Users\Education Use\crypto\node_modules\request\request.js:1154:10)
    at Request.emit (events.js:315:20)
    at IncomingMessage.<anonymous> (C:\Users\Education Use\crypto\node_modules\request\request.js:1076:12)
    at Object.onceWrapper (events.js:421:28)
    at IncomingMessage.emit (events.js:327:22)
    at endReadableNT (_stream_readable.js:1221:12)
[nodemon] app crashed - waiting for file changes before starting...

here is package.json file...

{
  "name": "crypto",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "jest --watchAll",
    "start": "npm run build-client && node index.js",
    "dev": "concurrently \"npm run dev-client\" \"nodemon index.js\"",
    "dev-peer": "cross-env GENERATE_PEER_PORT='true' ENV='development' nodemon index.js",
    "start-redis": "redis-server --daemonize yes",
    "build-client": "npm run clean && parcel build client/src/index.html --out-dir client/dist",
    "dev-client": "npm run clean && parcel client/src/index.html --out-dir client/dist",
    "clean": "rm -rf .cache client/dist"
  },
  "jest": {
    "testEnvironment": "node"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-class-properties": "^7.2.3",
    "cross-env": "^7.0.2",
    "jest": "^26.0.1",
    "nodemon": "^2.0.4"
  },
  "dependencies": {
    "body-parser": "^1.19.0",
    "concurrently": "^5.2.0",
    "elliptic": "^6.5.3",
    "express": "^4.17.1",
    "hex-to-binary": "^1.0.1",
    "history": "^4.7.2",
    "parcel-bundler": "^1.12.4",
    "pubnub": "^4.28.1",
    "react": "^16.13.1",
    "react-bootstrap": "^1.2.2",
    "react-dom": "^16.13.1",
    "react-router-dom": "^4.3.1",
    "redis": "^3.0.2",
    "request": "^2.88.2",
    "uuid": "^3.3.2"
  },
  "description": ""
}

What should i do to solve this issue???

Now both Express and React servers are running by single `npm run dev` command

Hafiz Saifullah — Fri, 17 Jul 2020 16:20:26 +0000

I was facing a problem. I wanted to run both frontend and backend servers using single command npm run dev, but it was not working.

Issue Resolved by installing concurrently using
npm i concurrently --save

and changing dev script by
"dev": "concurrently \"npm run dev-client\" \"nodemon index.js\""

now I am getting Fine result as below...

$ npm run dev

> crypto@1.0.0 dev C:\Users\Education Use\crypto
> concurrently "npm run dev-client" "nodemon index.js"

[1] [nodemon] 2.0.4
[1] [nodemon] to restart at any time, enter `rs`
[1] [nodemon] watching path(s): *.*
[1] [nodemon] watching extensions: js,mjs,json
[1] [nodemon] starting `node index.js`
[0] 
[0] > crypto@1.0.0 dev-client C:\Users\Education Use\crypto
[0] > npm run clean && parcel client/src/index.html --out-dir client/dist
[0] 
[1] listening at localhost: 3000
[0] 
[0] > crypto@1.0.0 clean C:\Users\Education Use\crypto
[0] > rm -rf .cache client/dist
[0] 
[0] Server running at http://localhost:1234 
Error: ENOENT: no such file or directory, stat 'C:\Users\Education Use\crypto\client\dist\index.html'
[1] [nodemon] restarting due to changes...
[1] [nodemon] restarting due to changes...
[1] [nodemon] restarting due to changes...
[1] [nodemon] restarting due to changes...
[0] ✨  Built in 51.89s.
[1] [nodemon] starting `node index.js`
[1] listening at localhost: 3000

Thanx a lot for all of those Who granted their kind consideration.