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?

Answer 1

Try running npx webpack-cli instead of npx webpack.

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

Answer 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...

Answer 3

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.

Answer 4

Try installing webpack-cli globally.

npm i -g webpack-cli

Go through this issue on github.

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