Search code examples
reactjsyarnpkgreact-scripts

Is it possible to run react-scripts start from within another directory that has a public folder but not a package.json file?


yarn version: 1.22.19

package.json file in the myapp dir:

"main": "server/index.js",
...
"dependencies": {
    "concurrently": "^6.2.2",
    ...
    "nodemon": "^2.0.13",
    "nodemailer": "^6.6.5",
    ...
    "react": "^17.0.2",
    ...
    "react-scripts": "^5.0.0",
    ...
}

Here's my file structure:

myapp
 | -- client
 |     | -- build
 |     | -- public
 |     | -- src
 |
 | -- mailer
 |     | -- index.js
 |     
 | -- node_modules
 |
 | -- server
 |     | -- index.js
 |
 | -- package.json
 | -- yarn.lock

Is this even a thing I can do?

Can I use yarn -- possibly in conjunction with react-scripts -- to start all three folders: client, mailer, and server from within the myapp folder, assuming I changed my terminal directory (cd) to myapp?


Solution

  • It seems like you're going for a monorepo architecture with the single node_modules at the root level. However, you'll still want a package.json for your client and mailer React apps.

    With Yarn workspaces, you can keep all node_modules installed at the root level (except ones that are unique to /client or /mailer, their unique node_modules will be installed in their respective directories. This way you still maintain each React app's package.json which contains react-scripts as normal.

    Then in your root-level package.json, you can start all 3 apps using yarn dev. See scripts below:

    "scripts": {
      "start": "node ./server/index.js",
      "start-client": "cd ./client && yarn start",
      "start-mailer": "cd ./mailer && yarn start",
      "start-app": "concurrently --kill-others-on-fail \"yarn start\" \"yarn start-client\" \"yarn start-mailer\"",
      "dev": "NODE_ENV=development yarn start-app"
    },
    

    I recommend using Lerna which uses Yarn under the hood and makes things easier to understand and deal with at a high level.

    While there may be a way to hack an app into doing this without package.json files, I don't think it's the right approach if you're focused on a monorepo / single node_modules at root.