[Help Request] webpack --watch seems blocking --workspaces execution

[marcog83]

Is there an existing issue for this?

• I have searched the existing issues

Current Behavior

I have a monorepo with the following structure

root
 - package.json { "scripts": { "start": "npm run start:core --ws" }, "workspace":["./packages/*"] }
 - packages
   - action-bar
     - package.json { "scripts": { "start:core": "webpack --watch" } }
   - view-1
     - package.json { "scripts": { "start:core": "webpack --watch" } }
   - view-2
     - package.json { "scripts": { "start:core": "webpack --watch" } }
 

When I run npm start, it runs only the first package.
It seems that --watch flag doesn't allow npm to run the other packages.
I removed the --watch flag and it worked fine, but it is not an option for me. I'd like to have webpack in watch mode.
The same happens when I start an Express server.

@package/action-bar@1.0.0 start:core
webpack --watch

webpack is watching the files…

Hash: 957d27c118caf599ee3c
Version: webpack 4.30.0
Time: 1187ms
Built at: 2021-05-22 13:55:16

Expected Behavior

I expected all the scripts run in --watch mode

Steps To Reproduce

I have a monorepo with the following structure

root
 - package.json { "scripts": { "start": "npm run start:core --ws" }, "workspace":["./packages/*"] }
 - packages
   - action-bar
     - package.json { "scripts": { "start:core": "webpack --watch" } }
   - view-1
     - package.json { "scripts": { "start:core": "webpack --watch" } }
   - view-2
     - package.json { "scripts": { "start:core": "webpack --watch" } }
 

When I run npm start, it runs only the first package.
It seems that --watch flag doesn't allow npm to run the other packages.
I removed the --watch flag and it worked fine, but it is not an option for me. I'd like to have webpack in watch mode.
The same happens when I start an Express server.

@package/action-bar@1.0.0 start:core
webpack --watch

webpack is watching the files…

Hash: 957d27c118caf599ee3c
Version: webpack 4.30.0
Time: 1187ms
Built at: 2021-05-22 13:55:16

Environment

• OS: Window 10
• Node: v12.18.3
• npm: 7.14.0

[cinderblock]

This option runs each matching script from each workspace sequentially, not concurrently.

One script needs to exit before the next one is started and a --watching program never exits (normally).

One common way to do what you want is to use a package like concurrently.

[marcog83]

I had a look at concurrently, but i cannot figure out how to use it in my case.

I got that concurrently can run multiple scripts in parallel, but they are all defined in the same package.json.
In my case a have a script at root level that goes through all the workspaces and executing the script, if defined in the inner package.json.

[cinderblock]

So, you could list out all your workspaces and have concurrently run all of them.

But, it sounds like what you really want is some system that automatically finds all your workspaces (which npm --ws does) and runs them concurrently. I personally don't know of a simple package that will do both of these jobs for you.

It shouldn't be too hard to roll your own script that finds all the workspaces.

---

That being said, there should be a way to have Npm generate a list of all the workspaces in a project.

Maybe just: npm --workspaces?

[marcog83]

Yes, you described exactly the functionality i'd like to use with npm workspaces.
I can do it with LernaJS, but actually I started investigating npm 7
to migrate my project from Lerna to npm 7 😄

[ruyadorno]

hi @marcog83 thanks for bringing it up to our attention. This is working as intended for the current implementation of workspaces in npm 7 and 8, although we are aware of the issue of running multiple jobs in parallel, it has been brought to our attention early on during our RFC process, ref: npm/rfcs#117 (review)

Similar to what @cinderblock suggested, I would suggest npm-run-all (which is my personal goto whenever I need to parallelize multiple tasks). I end up using a structure as such for my root scripts:

"scripts": {
  "start:action-bar": "npm run -w ./action-bar start",
  "start:view-1": "npm run -w ./view-1 start",
  "start:view-2": "npm run -w ./view-2 start"
  "start": "run-p start:*"
}

In the example above, the run-p bin is provided by npm-run-all so you need to make sure to npm i -D npm-run-all first.

For the future I would recommend keeping an eye to our RFC repo to be aware of when that parallelization feature might come up natively in npm.

Hope that helps!