npm ERR! syscall open npm ERR! enoent Could not read package.json: Error: ENOENT: no such file or directory, open '/client/package.json'

Question

I'm new to coding and I'm trying to re-deploy this project and for some reason it won't run the way I wanted after doing some updates. I'm on React version 18 and Node v21.6. Here's my folder structure: fnrc(main folder): -client -server -package.json

I'm using Concurrently to run both subfolders. When I try to npm run dev on my main folder(fnrc), it gives me this error: error

    > [email protected] dev
> concurrently "npm run client" "nodemon server.js"

[1] [nodemon] 3.0.3
[1] [nodemon] to restart at any time, enter `rs`
[1] [nodemon] watching path(s): *.*
[1] [nodemon] watching extensions: js,mjs,cjs,json
[1] [nodemon] starting `node server.js index.js`
[1] node:internal/modules/cjs/loader:1152
[1]   throw err;
[1]   ^
[1] 
[1] Error: Cannot find module '/Users/neilsolon/Documents/4mac/Website/fnrc/index.js'
[1]     at Module._resolveFilename (node:internal/modules/cjs/loader:1149:15)
[1]     at Module._load (node:internal/modules/cjs/loader:990:27)
[1]     at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:142:12)
[1]     at node:internal/main/run_main_module:28:49 {
[1]   code: 'MODULE_NOT_FOUND',
[1]   requireStack: []
[1] }
[1] 
[1] Node.js v21.6.0
[1] [nodemon] app crashed - waiting for file changes before starting...
[0] 
[0] > [email protected] client
[0] > npm start --prefix /client
[0] 
[0] npm ERR! code ENOENT
[0] npm ERR! syscall open
[0] npm ERR! path /client/package.json
[0] npm ERR! errno -2
[0] npm ERR! enoent Could not read package.json: Error: ENOENT: no such file or directory, open '/client/package.json'
[0] npm ERR! enoent This is related to npm not being able to find a file.
[0] npm ERR! enoent 
[0] 
[0] npm ERR! A complete log of this run can be found in: /Users/neilsolon/.npm/_logs/2024-01-28T03_14_54_746Z-debug-0.log
[0] npm run client exited with code 254

But when I cd into my client subfolder and npm run dev(with the "dev" script) or npm run start(without the "dev" script) it somehow works.

Here's my package.json of my main folder:

main

    `{
  "dependencies": {
    "audit": "^0.0.6",
    "concurrently": "^8.2.2",
    "fix": "^0.0.3",
    "npm": "^10.3.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "scripts": {
    "client": "npm start --prefix /client",
    "server": "nodemon server.js",
    "dev": "concurrently \"npm run client\" \"nodemon server.js\"" 
  },
  "devDependencies": {
    "nodemon": "^3.0.3",
    "react-scripts": "^5.0.1",
    "webpack-cli": "^5.1.4"
  }
}`

My client subfolder: client

`enter code here{
  "name": "nfrc",
  "homepage": "https://fnrc.ca",
  "version": "0.1.0",
  "private": true,
  "proxy": "http://localhost:3001",
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "axios": "^1.6.7",
    "bootstrap": "^4.6.2",
    "react": "^18.2.0",
    "react-bootstrap": "^1.6.8",
    "react-dom": "^18.2.0",
    "react-helmet": "^6.1.0",
    "react-scripts": "^5.0.1",
    "react-snap": "^1.13.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "postbuild": "react-snap",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}`

My server subfolder:

server

{
  "name": "server",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "client": "npm start --prefix /client",
    "server": "nodemon server.js",
    "dev": "concurrently \"npm run client\" \"nodemon server.js\""
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.19.0",
    "concurrently": "^5.2.0",
    "express": "^4.17.1",
    "nodemailer": "^6.4.10",
    "nodemon": "^2.0.4"
  }
}

I tried to remove package-lock.json and node_modules in my main folder, npm clear cache, and npm install. No luck.

Hopefully you guys can help me out so I can npm run build this. Thanks in advance!

I updated the dependencies and React and NodeJS versions. I removed package-lock json and node_modules in my main folder and then npm install. I also tried npm init.

Answer 1

In the error message screenshot. It looks like there's no package.json in the client folder.

Best practices: Folder structure for client and server using create-react-app

I'm new to coding also, hope this helps

Inside you main package.json, remove the / before client. Replace line 11 with "client": "npm start --prefix client". This will assume that the client directory is directly inside the root directory.

Reference links for eslint conflict error[Edited]

Plugin “react” was conflicted between “package.json » eslint-config-react-app

Issues#4186