EMP3环境下，yarn出现webpack module未安装问题

[newstart0514]

发生了什么

在使用yarn包管理器的时候，使用emp3.0创建vue项目，安装完依赖时，我们发现警告：

在执行dev命令的时候，我们遇到了如下错误：

检查/node_modules/vue-loader/lib/plugin-webpack5.js，发现引入了webpack，但没有该依赖

经过问题溯源，发现对于vue-loader源代码，使用pnpm和npm构建运行是没有问题的，webpack会被正确安装。后续我们发现vue2以及vue3插件都有类似的问题出现。

问题原因

在对npm、yarn以及pnpm三款社区流行的包管理器测试中，我们发现，三款包管理器对于peerDependencies的兼容处理不太相同。

• NPM的处理：在NPM7及以后的版本中，默认会安装peerDependencies。当一个包被安装时，npm会尝试找到与宿主项目中已存在的依赖相兼容的peerDependencies版本。如果npm无法解析出一个兼容的版本，它可能会抛出错误或者警告。
• Yarn的处理：yarn不会自动安装peerDependencies，并且如果发现树中的对等依赖项版本无效，则会发出警告。这意味着yarn不会主动去安装peerDependencies，而是将这个责任留给了开发者或者项目维护者。
• PNPM的处理：pnpm的行为与npm类似，也会尝试安装与宿主项目中已存在的依赖相兼容的peerDependencies版本。pnpm在处理依赖关系时，会考虑到包的兼容性，并尝试找到最优的解决方案。

总结来说，yarn的设计理念更倾向于让开发者明确地管理他们的依赖关系，而不是自动地做出决定。

解决方案

• 手动添加webpack到插件的package.json中，这样在执行yarn时，它会被正确引入，而不会缺失
• (推荐）在原有的插件的package.json中添加如下命令，使得webpack正确安装至与node版本兼容的版本，而不影响node其他版本用户的使用

"resolutions": {
    "webpack": "^4.1.0 || ^5.0.0-0"
}

• 强制开发者使用pnpm或NPM，这种做法不推荐，可能会带来其他问题

The larger the version span, the more important it is to ensure its stability!

[ckken]

mark!