npx webpack insists on installing webpack-cli but its already installed

Question

I am attempting to run the command:

npx webpack

It tells me it needs webpack-cli and asks if it should install it, I say 'yes'. Then it gives me:

PS C:\_ljdev\webpack demo> npx webpack
npx: installed 321 in 11.89s
One CLI for webpack must be installed. These are recommended choices, delivered as separate packages:
 - webpack-cli (https://github.com/webpack/webpack-cli)
   The original webpack full-featured CLI.
We will use "npm" to install the CLI via "npm install -D".
Do you want to install 'webpack-cli' (yes/no): yes
Installing 'webpack-cli' (running 'npm install -D webpack-cli')...
npm WARN webpack-cli@3.2.3 requires a peer of webpack@4.x.x but none is installed. You must install peer dependencies yourself.

+ webpack-cli@3.2.3
updated 1 package and audited 1053 packages in 2.093s
found 0 vulnerabilities

{ Error: Cannot find module 'webpack-cli'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
    at Function.Module._load (internal/modules/cjs/loader.js:507:25)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at runCommand.then (C:\Users\luke.jenner\AppData\Roaming\npm-cache\_npx\3272\node_modules\webpack\bin\webpack.js:143:5)
    at process._tickCallback (internal/process/next_tick.js:68:7) code: 'MODULE_NOT_FOUND' }

So I attempt to install it locally, manually via:

PS C:\_ljdev\webpack demo> npm install webpack-cli
npm WARN webpack-cli@3.2.3 requires a peer of webpack@4.x.x but none is installed. You must install peer dependencies yourself.

+ webpack-cli@3.2.3
updated 1 package and audited 1053 packages in 8.034s
found 0 vulnerabilities

And I check that it is installed using:

PS C:\_ljdev\webpack demo> npm list
webpack-demo@1.0.0 C:\_ljdev\webpack demo
`-- webpack-cli@3.2.3
  +-- chalk@2.4.2
  | +-- ansi-styles@3.2.1
(other dependencies omitted for brevity)

So it appears installed.

I try npx webpack again and get the exact same output and question to install webpack-cli again.

Can anyone tell me why it's not finding the webpack-cli local install? Does it have to be installed globally?

Or more curiously: why does it fail when it tries to install it itself?

Installing webpack globally really defeats the purpose of using npx, which is: "Executes either from a local node_modules/.bin, or from a central cache, installing any packages needed in order for to run." See this article to better understand what npx is for: https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b — JTech, Feb 26 '19 at 22:44
Does this answer your question? [One CLI for webpack must be installed - Can't make webpack run](https://stackoverflow.com/questions/52800634/one-cli-for-webpack-must-be-installed-cant-make-webpack-run) — Aleksi, Dec 01 '21 at 06:46

score 2 · Answer 1 · answered Aug 29 '20 at 21:54

2

I have hit this error just recently. Deleting the node_modules folder and reinstalling the dependencies with npm i made the npx webpack ... command work again. Can't really say why...

answered Aug 29 '20 at 21:54

jmac

95
8

hustnzj · Answer 2 · 2019-06-13T10:05:06.167

1

I have encountered the same problem.

After half a day of testing, I finally found out that there are special characters in my project path. Remove them, re-run npx webpack and everything is OK.

There is a space in your project path, maybe you can remove it and re-try. click here to verify my result

Edit:

Sorry, I didn't express clearly. I meant that there were special characters in the project path which would be converted into some others during the npm installation.

If you change your working directory name, such as from webpack-demo to webpack/demo, remove and re-install webpack and webpack-cli. Then open the package.json of webpack package in node_modules directory, you will find the _where attribute which contains local absolute path but is different from your current real project path.

I guess(probably not right, maybe some other method) that npx command will use the _where attribute to locate the webpack package. So if the path is wrong, npm will have a tip that you should install webpack-cli first. But even you re-install the webpack-cli, the other scripts still can't find it.

edited Jun 13 '19 at 10:05

answered Jun 12 '19 at 08:51

hustnzj

525
6
13

I removed the space and it worked. But then i put the space back in and it still worked...so I don't know why its working now. But it seems that having the space in the path didn't stop it from working... – JTech Jun 12 '19 at 22:57
@JTech sorry, I have revised my answer. Hope that will be helpful. – hustnzj Jun 13 '19 at 08:39
@JTech, I found the reason. If you open the `webpack.js` file in the node_modules/.bin directory, you will find the code is attemping to resolve the `webpack-cli` package path and if the locally installed package is not resolved, the default global path will be used. That' s why `npx webpack` will work if u install webpack and webpack-cli globally. – hustnzj Jun 14 '19 at 01:32

score 0 · Answer 3 · answered Dec 01 '21 at 06:56

0

Try running npx webpack-cli instead of npx webpack.

You need to install webpack-cli locally first using npm install --save-dev webpack-cli.

answered Dec 01 '21 at 06:56

Aleksi

4,483
33
45

score -1 · Answer 4 · answered Feb 26 '19 at 16:24

-1

Try installing webpack-cli globally.

npm i -g webpack-cli

Go through this issue on github.

https://github.com/webpack/webpack-cli/issues/299

answered Feb 26 '19 at 16:24

Kodin

772
8
23

Installing webpack globally really defeats the purpose of using npx, which is: "Executes either from a local node_modules/.bin, or from a central cache, installing any packages needed in order for to run." See this article to better understand what npx is for: https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b – JTech Feb 26 '19 at 22:43

npx webpack insists on installing webpack-cli but its already installed

4 Answers4