Webpack-cli: within monorepo keep getting [webpack-cli] The command moved into a separate package: @webpack-cli/serve

[IljaDaderko]

I'm not sure if this is a bug or something else, but on every version after 5.2 I keep getting following error when trying to run serve command:

[webpack-cli] The command moved into a separate package: @webpack-cli/serve

The command that triggers this is

webpack serve --config webpack/development.js

CLI asks me if I want to install @webpack-cli/serve, I agree to that prompt and install that, but then still get the error. My hunch is that it can be related to monorepos?

My repo structure looks like this

 app/
   package.json
package.json

I run my commands from root package.json, but all webpack packages are scoped to app.

[webpack-bot]

For maintainers only:

• [ ] webpack-4
• [ ] webpack-5
• [ ] bug
• [ ] critical-bug
• [ ] enhancement
• [ ] documentation
• [ ] performance
• [ ] dependencies
• [ ] question

[vincentbriglia]

and once that error is fixed by adding @webpack-cli/serve as a dependency, you will get
[webpack-cli] You need to install 'webpack-dev-server' for running 'webpack serve'. but there it's because the require stack goes all the way up to the hoisted node_modules

[webpack-cli] You need to install 'webpack-dev-server' for running 'webpack serve'.
Error: Cannot find module 'webpack-dev-server'
Require stack:
- xxxx/node_modules/@webpack-cli/serve/lib/index.js
- xxxx/packages/klik-react-typescript-scss-webpack-example/node_modules/webpack-cli/lib/utils/package-exists.js
- xxxx/packages/klik-react-typescript-scss-webpack-example/node_modules/webpack-cli/lib/webpack-cli.js
- xxxx/packages/klik-react-typescript-scss-webpack-example/node_modules/webpack-cli/lib/bootstrap.js
- xxxx/packages/klik-react-typescript-scss-webpack-example/node_modules/webpack-cli/bin/cli.js
- xxxx/packages/klik-react-typescript-scss-webpack-example/node_modules/webpack/bin/webpack.js
error Command failed with exit code 2.

the only way I managed to get it to work is by adding a nohoist section for lerna / yarn workspaces.

add this to your workspaces config:

    "nohoist": [
      "**/webpack",
      "**/webpack/**",
      "**/webpack-dev-server",
      "**/webpack-dev-server/**",
      "**/@webpack-cli",
      "**/@webpack-cli/**",
      "**/webpack-cli",
      "**/webpack-cli/**"
    ]

[snitin315]

Please provide a minimal reproducible repo.

[IljaDaderko]

@snitin315 here you go https://github.com/IljaDaderko/webpack-11951

to recreate the issue run following from root (or yarn equivalent, might need to change scripts in package.json)

npm i --legacy-peer-deps
npm run app:develop

EDIT: I just tested this same setup with all packages updated to their latest versions, and result is the same. Only that nohoist trick from @vincentdchan does the trick, but obviously it's a hacky workaround.

[alexander-akait]

@IljaDaderko Please use the issue template in future, otherwise we will close your issue with reply, respect time of other developers, thanks

[IljaDaderko]

@evilebottnawi will do, I wasn't sure if this was a legitimate issue or some change I missed while upgrading webpack version, hence used [Other] option.

[alexander-akait]

@IljaDaderko What is version of npm? I think you have hoist problem here, and we can't fix it on our side

[IljaDaderko]

@evilebottnawi [email protected], but also happens to me on [email protected]. Are you sure this is an upstream issue? This message only started coming up after [email protected], prior to that everything worked as expected.

Also tested with clean re-installs of packages with all lockfiles removed.

[alexander-akait]

@IljaDaderko Can you run npm ls webpack-cli and npm ls @webpack-cli/serve?

[IljaDaderko]

Sure, here are the outputs @evilebottnawi

npm ls webpack-cli

[email protected] /Users/ilja/Documents/GitHub/project
└─┬ [email protected] -> /Users/ilja/Documents/GitHub/project/packages/app
  └─┬ [email protected]
    ├─┬ @webpack-cli/[email protected]
    │ └── [email protected] deduped
    └─┬ @webpack-cli/[email protected]
      └── [email protected] deduped

npm ls @weebpack-cli/seerve

[email protected] /Users/ilja/Documents/GitHub/project
└─┬ [email protected] -> /Users/ilja/Documents/GitHub/project/packages/app
  └─┬ [email protected]
    └── @webpack-cli/[email protected]

[sibelius]

I'm getting this error on yarn 1 as well

which webpack-cli version does not have this problem?

[alexander-akait]

@sibelius Do you use monorepos too?

[sibelius]

I have a working monorepo using webpack 5

and I have a broken monorepo using webpack 4

[alexander-akait]

@sibelius Is this problem happens only for webpack@4 or webpack@5?

[sibelius]

can we make @webpack-cli/serve a warning?

so we can migrate when it is done?

for me only on webpack@4

[sibelius]

@webpack-cli/[email protected]
[email protected]

should I try 4.2.0?

[alexander-akait]

Update [email protected]

[sibelius]

[email protected] worked for us

tks

[IljaDaderko]

In my case this doesn't work

"webpack": "5.4.0",
"webpack-cli": "4.2.0",

[alexander-akait]

Investigating the problem

[alexander-akait]

@IljaDaderko updating to 4.2 solve the problem, tests on npm and yarn, please update lock file too