html-webpack-plugin 和 @cypress/webpack-dev-server 的 Yarn 问题

Question

我遇到问题

vue-cli-service build

无法找到

html-webpack-plugin

。这已经在

devDependencies

上的

package.json

中定义：

package.json

以下日志摘录

“纱线构建”日志

我注意到，在

yarn install

期间，我看到以下警告：

“纱线安装”日志

我的理论是纱线缓存问题和缓存存储冲突。

如果我从 devDependency 中删除

html-webpack-plugin

并将所有内容留给纱线，它会抱怨缺少

html-webpack-plugin

。清除我所有的本地纱线缓存并重新安装 - 同样的问题。删除现有的

yarn.lock

并重新运行安装，效果相同。问题。

如果我手动运行

yarn install && yarn add -D html-webpack-plugin

，我会收到相同的警告，但

yarn build

可以工作。我在纱线脚本中有一个临时解决方法：

"scripts": {
    "install:dev": "yarn && yarn add -D html-webpack-plugin"
}

yarn 不提供依赖性

 % yarn why html-webpack-plugin
yarn why v1.22.19
[1/4] 🤔  Why do we have the module "html-webpack-plugin"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
error We couldn't find a match!
✨  Done in 0.24s.

但是我们依赖于

html-webpack-plugin-4

和

html-webpack-plugin-5

% yarn why html-webpack-plugin-4
yarn why v1.22.19
...
info Reasons this module exists
   - "@cypress#webpack-dev-server" depends on it
   - Hoisted from "@cypress#webpack-dev-server#html-webpack-plugin-4"
...

% yarn why html-webpack-plugin-5
yarn why v1.22.19
...
=> Found "[email protected]"
info Has been hoisted to "html-webpack-plugin-5"
info Reasons this module exists
   - Specified in "devDependencies"
   - Hoisted from "@cypress#webpack-dev-server#html-webpack-plugin-5"
   - Hoisted from "@vue#cli-service#html-webpack-plugin-5"
...

但这并不是纱线应该如何工作的......有谁有更好的解决方案，或者我最初的项目设置有问题？

Answer 1

正如评论中所讨论的，这看起来像是 Yarn 1.x 分辨率错误。

@cypress/webpack-dev-server

的

package.json

使用

npm:

alise 将

html-webpack-plugin-5

映射到

html-webpack-plugin

的 v5。

这一切都很好，但是

@vue/cli-service

也依赖于

html-webpack-plugin

，并且不希望它有别名。 Yarn 1，似乎是由于一个错误，也为该依赖项起了别名，所以它无法在它期望的地方找到它。

Yarn 1 较旧，将其升级到最新版本可以解决该问题。