Webpack-Webpack-dev-server:找不到命令


97

我正在使用webpack在React Webapp上工作,与本教程一起宽松地工作。

偶然地,我将node_modules文件夹添加到了我的git中。然后,我再次使用将其删除git rm -f node_modules/*

现在,当我尝试启动webpack服务器时,出现以下错误:

> webpack-dev-server -d --config webpack.dev.config.js --content-base public/ --progress --colors

sh: webpack-dev-server: command not found

npm ERR! Darwin 14.4.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "devserve"
npm ERR! node v0.12.4
npm ERR! npm  v2.10.1
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! Blabber@0.0.1 devserve: `webpack-dev-server -d --config webpack.dev.config.js --content-base public/ --progress --colors`
npm ERR! spawn ENOENT

起初我以为这只是我的项目,但是后来我签出了该教程的代码检查点:同样的错误!因此,全球似乎有些混乱。

这是我到目前为止尝试过的:

  • rm node_modules 并重新安装 npm install
  • npm cache clean正如有人在github上提到这个问题
  • 使用以下命令全局安装webpack npm install -g webpack
  • 系统中完全删除node和npm(使用本指南),然后使用brew重新安装

该错误消息仍然存在。我还能尝试什么?

PS:的内容webpack.dev.config.js是:

var config = require('./webpack.config.js');
var webpack = require('webpack');

config.plugins.push(
  new webpack.DefinePlugin({
    "process.env": {
      "NODE_ENV": JSON.stringify("development")
    }
  })
);

module.exports = config;

请提供文件内容webpack.dev.config.js
stdob--

我遇到相同的错误,文件夹中的webpack-dev-server肯定就在那里
Damon

Answers:


164

好吧,这很简单:

npm install webpack-dev-server -g

令我感到困惑的是我一开始并不需要它,可能是新版本改变了。


30
由于某种原因,如果没有-g标志,它对我不起作用。所以:npm i webpack-dev-server -g解决了问题。
Martin Velchevski 2016年

2
我也需要-g标志
Alex Grande

5
我还需要npm install webpack -g,因为它最初不是全局安装的
TJ Trapp

1
这很令人困惑,因为在webpack页面上,他们的示例中没有-g选项。如果您不想在全球范围内安装,则可以在package.json中创建一个脚本,然后通过npm run运行它。
kingd9

我尝试使用此命令“ npm uninstall webpack-dev-server -g --save”卸载此软件包,但未卸载,请让我知道如何卸载此软件包。
巴芬(Bhavin)

32

仅供参考,要像您尝试的那样通过命令行访问任何脚本,您需要将该脚本注册为shell脚本(或任何类型的脚本,如.js,.rb),就像dir中的这些文件一样 /usr/bin在UNIX中。并且,系统必须知道在哪里可以找到它们。即该位置必须以$PATH数组形式加载。


在您的情况下,该脚本webpack-dev-server已经安装在./node_modules目录内的某个位置,但是系统不知道如何访问它。因此,要访问该命令webpack-dev-server,您还需要在全局范围内安装脚本。

$ npm install webpack-dev-server -g

在这里,-g指的是全球范围。


但是,不建议这样做,因为您可能会遇到版本冲突的问题。因此,您可以在npmpackage.json文件中设置命令,例如:

  "scripts": {
    "start": "webpack-dev-server -d --config webpack.dev.config.js --content-base public/ --progress --colors"
   }

通过此设置,您可以使用简单的命令访问所需的脚本

$ npm start

太短,难以记忆和发挥。并且,npm知道模块的位置webpack-dev-server


但是,当我跑步时node_modules/.bin/webpack-dev-server,为什么会说这是无效命令?我认为跑步node_modules/.bin/webpack-dev-server等于跑步npm run dev
Chor

14

该脚本webpack-dev-server已安装在./node_modules目录中。您可以通过以下方式在全球范围内再次安装

sudo npm install -g webpack-dev-server

或像这样运行

./node_modules/webpack-dev-server/bin/webpack-dev-server.js -d --config webpack.dev.config.js --content-base public/ --progress --colors

. 表示在当前目录中查找。


8

运行时出现问题: yarn start

首先运行已修复: yarn install


1
yarn install就我而言,简单就可以了。不知道是什么原因。
Hinrich '18

1
npm i您更喜欢的那个人
慧娴

5

我遇到了同样的问题,但是以下步骤帮助我摆脱了它。

  1. 在本地安装“ webpack-dev-server”(在项目目录中,因为它不是从全局安装中挑选的)

    npm install --save webpack-dev-server

可以验证node_modules中是否存在“ webpack-dev-server”文件夹。

  1. 使用npx直接运行

npx webpack-dev-server --mode development --config ./webpack.dev.js

npm run start 在package.json脚本中的输入应与上面类似(没有npx)的情况下也可以正常工作。


1

我发现接受的答案并非在所有情况下都有效。为了确保它100%正常工作,还必须清除npm缓存。直接进入缓存并清除锁,缓存,anonymous-cli-metrics.json; 或可以尝试npm cache clean

由于作者在尝试推荐的解决方案之前已经清除了缓存,因此可能无法使其成为先决条件的一部分。


1

对于全局安装: npm install webpack-dev-server -g

对于本地安装 npm install --save-dev webpack

当您在package.json文件中引用webpack时,它将尝试在node_modules \ .bin \位置中查找它

本地安装后,将在以下位置创建文件wbpack:\ node_modules \ .bin \ webpack


0

我先安装,npm install --save-dev webpack-dev-server然后设置package.json和webpack.config.js像这样: setting

然后,我运行webpack-dev-server并得到此错误 error

如果我不习惯npm install -g webpack-dev-server安装,该如何解决?

configuration has an unknown property 'colors'通过移除修复了错误colors:true。有效!


0

我在Yarn上遇到了类似的问题,以上都不对我有用,所以我简单地删除./node_modules并运行yarn install,问题就消失了。


0

npm install webpack-dev-server -g-Windows操作系统

最好在Linux中使用sudo以避免权限错误

sudo npm安装webpack-dev-server -g

您可以使用sudo npm install webpack-dev-server --save将其添加到package.json。

有时您可能需要运行以下命令。

npm install webpack-cli --save或npm install webpack-cli -g


请不要建议将sudo与npm一起使用。
richardsonwtr


0

安装VSCode并添加远程Git存储库后,我注意到了相同的问题。不知何故,该/node_modules/.bin文件夹被删除并npm install --save webpack-dev-server在命令行中运行,重新安装了丢失的文件夹并修复了我的问题。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.