找不到模块 'webpack/bin/config-yargs'

Cannot find module 'webpack/bin/config-yargs'

在 运行 webpack-dev-server --config config/webpack.dev.js --progress --profile --watch --content-base src/ 时出现错误。这是错误日志:

module.js:442
throw err;
^

Error: Cannot find module 'webpack/bin/config-yargs'
at Function.Module._resolveFilename (module.js:440:15)
at Function.Module._load (module.js:388:25)
at Module.require (module.js:468:17)
at require (internal/module.js:20:19)
at Module._compile (module.js:541:32)
at Object.Module._extensions..js (module.js:550:10)
at Module.load (module.js:458:32)
at tryModuleLoad (module.js:417:12)
at Function.Module._load (module.js:409:3) 

我遇到过类似的问题。我认为这与 webpack 版本有关。换了webpack版本后,最新的一切都很好...

尝试将 package.json 中的 webpack 版本从 1.x 更改为 2.x:

例如:

 "devDependencies": {
    "webpack": "2.2.0-rc.3",
    "webpack-dev-server": "2.1.0-beta.0",
    "webpack-validator": "^2.3.0"
  }

当您将 webpack-dev-server 的预发布版本与 webpack 的发布版本一起使用时,有时会发生这种情况,反之亦然。

当我只在本地安装 webpack 而还没有全局安装时,我也会出现这个错误。

虽然我在全局安装了 webpack-dev-server,但它依赖于 webpack 的全局安装。公平地说,npm 在安装 webpack-dev-server 时确实抱怨过:

UNMET PEER DEPENDENCY webpack@^2.2.0

我通过 运行 npm start 修复了这个解决方案,它只是一个包装器 运行 'webpack-dev-server' 而不是 运行 webpack-dev-server 直接进入安慰。问题是我将选项传递给了一个我不应该将选项传递给的方法。

运行 webpack-dev-servernpm start 向我显示了正确的错误消息。 运行webpack-dev-server直接只给了我"Error: Cannot find module 'webpack/bin/config-yargs' "。奇怪。

我在: "webpack": "^2.6.1", "webpack-dev-server": "^2.7.1"

一般情况是因为webpack和webpack-dev-server版本不兼容。 像我也有这个问题,我电脑的webpack是1.15.0,但是webpack-dev-server是2.x以上的版本。 所以我卸载了 webpack-dev-server: npm uninstall webpack-dev-server -g 然后安装1.15.0版本的webpack-dev-server,可以通过npm install webpack-dev-server@1.15.0 -g

解决这个问题

这通常是由于库之间的版本不匹配(在您的情况下包括 webpack/yargs)。当您将项目搁置一段时间并且 node_modules 目录中的某些依赖项变得陈旧时,这种情况会经常发生。一个非常简单的解决方案,在大惊小怪之前,只需将 node_modules 目录移动到一个临时位置,然后重新 运行 npm install:

% mv node_modules nod_modules.REMOVED
% npm install

然后,尝试重新运行ning webpack。

尝试将 webpack 版本更改为 3.0 并将 web-dev-server 更改为 2.7.1

例如:

"devDependencies": {
    "webpack": "^3.0.0",
    "webpack-cli": "2.0.13",
    "webpack-config-utils": "2.0.0",
    "webpack-dev-server": "^2.7.1",
    "webpack-validator": "2.2.7"
}

我忘了安装 webpack-cli。所以我 运行 下面的命令和问题得到修复。

npm i -D webpack-cli

我在使用 webpack 4 时遇到了同样的问题。

版本兼容问题

解决问题 运行 按照以下命令在 web pack 4 中安装 webpack-cli 。

 yarn add webpack-cli -D

要升级所有软件包(在安装 webpack-cliwebpack-dev-server 之后),您可以

npm --depth=9999 upgrade

这应该可以解决版本不匹配的问题。

更新您的 Webpack 版本(和 Webpack CLI):

npm install --save-dev webpack webpack-cli webpack-dev-server webpack-merge

如果您不使用上述任何一种,请随意省略。

None 以上答案对我有用。如果你仍然收到这个错误,你可以试试这个,this 解决了我的问题:

Open node_modules\webpack-dev-server\bin\webpack-dev-server.js

Change Line 84: require('webpack-cli/bin/config-yargs')(yargs);

收件人:

require('webpack-cli/bin/config/config-yargs')(yargs);

Change Line 92: const config = require('webpack-cli/bin/convert-argv')(yargs, argv, {

收件人:

const config = require('webpack-cli/bin/utils/convert-argv')(yargs, argv, {

如果您正在使用 webpack-cli 4 或 webpack 5,请将 webpack-dev-server 更改为 webpack serve.

示例:

"serve": "webpack serve --config config/webpack.dev.js --progress"

您可能还想在 GitHub 上查看此 comment:

NPM package.json scripts are a convenient and useful means to run locally installed binaries without having to be concerned about their full paths. Simply define a script as such:

For webpack-cli 3.x:

"scripts": {   "start:dev": "webpack-dev-server" }

For webpack-cli 4.x:

"scripts": {   "start:dev": "webpack serve" }

在我的例子中,解决方案只是使用以前的版本 -

"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"

使用以下命令弃用 webpack-cli 版本:

npm install -D webpack-cli@3

新版本处于 Beta 阶段,可能会修复此错误。

更新3 月 21 日

尝试使用以下命令更新您的 webpack 依赖项

npm install --save-dev webpack webpack-cli webpack-dev-server

如果它不起作用,请按以下方式使用

我有这些依赖关系,但我遇到了同样的问题

"webpack": "^5.6.0",
"webpack-cli": "^4.2.0",
"webpack-dev-server": "^3.11.0"

而且我找到了一个 解决方案,在 package.json 中添加新脚本或在您的启动脚本中对我有用。所以你也可以试试这个方法

"dev": "webpack serve --mode development --env development"

问题出在较新的 webpack-cli 版本上。如果 webpack-cli <= 3.x webpack-dev-server 包工作正常。对于 webpack-cli >= 4.x,使用 npx webpack serve 命令到 运行 本地服务器。

For webpack-cli 3.x:
"scripts": {
  "start:dev": "webpack-dev-server --mode=development"
}

For webpack-cli 4.x:
"scripts": {
  "start:dev": "webpack serve --mode=development"
}

请使用 webpack serve for 运行 webpack-dev-server

webpack serve --config config/webpack.dev.js --progress --profile --watch --content-base src/

解决方案

package.json

"scripts": {
    "startdev": "webpack serve --mode development --env development --hot --port 3000"
    ...
    ...
  },
"devDependencies": {
...
    "webpack": "^5.10.1",
    "webpack-cli": "^4.2.0"
 },

控制台

$ npm run startdev

降级 webpack-cli

npm install -D webpack-cli@3

2021 年 1 月

使用 webpack 5,只需将 webpack-dev-server 命令替换为 webpack serve

我尝试了以下几行并解决了:

  1. 因为问题出在 webpack-dev-server 上,所以转到节点模块。
  2. 找到 webpack-dev-server 然后转到依赖关系
  3. 查看webpack和webpack-cli的依赖信息及其版本
  4. 使用完全相同的版本重新安装这些名称。

然后尝试重新运行开发服务器。

以我为例: “开发服务器”:“webpack-dev-server --open”

控制台: npm 运行 开发服务器

-> 所以,首先排除 node_modules 文件夹。
->如果在存档 package.json 中验证依赖项:“webpack”、“webpack-cli”和“webpack-dev-server”,它们在 "dependencies":{}.
中 -> 最后,打开终端执行命令:yarn。安装全部依赖于被排除的。

将命令从 "serve": "webpack-dev-server" 更改为 "serve":"webpack serve" 解决了这个问题。我已经用 webpack dev server v3.11.0v3.11.2 尝试过这个解决方案;两者都很好。

scripts 下的 package.json 中使用 webpack serve 而不是 webpack-dev-server。它非常适合我。我有同样的错误,这解决了它。

我的开发依赖:

"webpack": "^5.22.0",
"webpack-cli": "^4.5.0",
"webpack-dev-server": "^3.11.2"

原始 post :

我刚刚解决了。

问题出在 index.html.

路径上

来自:

<script src="./dist/myBundle.js"></script>

至:

<script src="myBundle.js"></script>

我通过在 package.json.

上创建脚本命令解决了这个问题
"dev": "webpack serve --config webpack.config.js --open",

我安装了以下依赖项(未指定任何特定版本)

 "webpack-cli": "^4.5.0",
 "webpack-dev-server": "^3.11.2"

此错误出现在 yarn start 期间,package.json 中的以下条目特定于 scripts.start 属性。

 "scripts": {
    "start": "webpack-dev-server --open",
    "build": "webpack"
  }

所以,原来 webpack-dev-server --open 正在寻找 webpack-cli 版本 3.3。我通过安装 webpack-cli 的特定版本摆脱了这个错误。工作 package.json 看起来像这样:

  "webpack-cli": "3.3",
  "webpack-dev-server": "^3.11.2"

但是,如果您不想降级 webpack-cli 版本,请将 "start": "webpack-dev-server --open" 更新为 "start": "webpack serve --open"

是webpack版本问题 您需要使用此命令更新您的 webpack

npm install --save-dev webpack webpack-cli webpack-dev-server

现在在 package.json 文件中使用

"dev": "webpack serve --config webpack.config.js --open"

这是因为 webpack-cli 版本的变化。

  1. 如果webpack-cli版本低于4.x,可以使用webpack-dev-server
  2. 如果webpack-cli版本为4.x或更高,可以使用webpack serve

webpack-cli 3.x及以下

    "scripts": {
      "dev-server": "webpack-dev-server"
    }

webpack-cli 4.x及以上

    "scripts": {
      "dev-server": "webpack serve"
    }
    "scripts": {
      "dev-server": "webpack serve "
    }

来源:webpack dev-server

我遇到过类似的问题。我觉得跟webpack版本有关。

2021 年 7 月更新

拥有 "webpack-cli": "^4 or above", "webpack": "^5 or above", 版本的人。

您可以尝试通过此命令更新您的 webpack 版本

npm install --save-dev webpack webpack-cli webpack-dev-server

现在去你package.json,在scrpits下添加这一行

"dev": "webpack serve --mode development --env development"

这对我来说完全有效。