webpack-circular-dependency-plugin webpack5 使用

Webpack 5 内置了对循环依赖的支持，因此不再需要使用 `webpack-circular-dependency-plugin` 插件。

如果你使用的是 Webpack 4，可以安装该插件并在 webpack.config.js 中进行配置：

const CircularDependencyPlugin = require('webpack-circular-dependency-plugin');

module.exports = {
  // ...
  plugins: [
    new CircularDependencyPlugin({
      // exclude detection of files based on a RegExp
      exclude: /node_modules/,
      // add errors to webpack instead of warnings
      failOnError: true,
      // set the current working directory for displaying module paths
      cwd: process.cwd(),
    }),
  ],
};

其中，`exclude` 选项可以用来排除检测循环依赖的文件，`failOnError` 选项可以将循环依赖检测的警告转换成错误，`cwd` 选项可以设置当前工作目录以显示模块路径。

相关问题

Could not resolve dependency: npm ERR! peer html-webpack-plugin@"^3.0.0 || ^4.0.0" from script-ext-html-webpack-plugin@2.1.5 npm ERR! node_modules/script-ext-html-webpack-plugin npm ERR! dev script-ext-html-webpack-plugin@"2.1.5" from the root project

这个错误信息看起来是在使用 npm 安装某个依赖时出现的。错误提示显示缺少 html-webpack-plugin 的 peer dependency，即 html-webpack-plugin 的版本需要符合 "^3.0.0 || ^4.0.0"，而您当前的 script-ext-html-webpack-plugin 版本是 2.1.5，它需要符合这个版本要求。

为了解决这个问题，您可以尝试升级 html-webpack-plugin，或者降低 script-ext-html-webpack-plugin 的版本，使其符合当前已安装的 html-webpack-plugin 的版本要求。

您可以尝试运行以下命令：

npm install html-webpack-plugin@^3.0.0 --save-dev

这将安装符合要求的 html-webpack-plugin。如果这个命令没有解决问题，您可以尝试降低 script-ext-html-webpack-plugin 的版本，或者查看其他可能的解决方案。

D:\code\gm>npm install npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: script-ext-html-webpack-plugin@2.0.1 npm ERR! Found: html-webpack-plugin@4.0.0-alpha npm ERR! node_modules/html-webpack-plugin npm ERR! dev html-webpack-plugin@"4.0.0-alpha" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer html-webpack-plugin@"^3.0.0" from script-ext-html-webpack-plugin@2.0.1 npm ERR! node_modules/script-ext-html-webpack-plugin npm ERR! dev script-ext-html-webpack-plugin@"2.0.1" from the root project npm ERR! npm ERR! Conflicting peer dependency: html-webpack-plugin@3.2.0 npm ERR! node_modules/html-webpack-plugin npm ERR! peer html-webpack-plugin@"^3.0.0" from script-ext-html-webpack-plugin@2.0.1 npm ERR! node_modules/script-ext-html-webpack-plugin npm ERR! dev script-ext-html-webpack-plugin@"2.0.1" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! D:\Develop\nodejs\node_cache\_logs\2023-07-20T02_53_20_829Z-eresolve-report.txt npm ERR! A complete log of this run can be found in: npm ERR! D:\Develop\nodejs\node_cache\_logs\2023-07-20T02_53_20_829Z-debug-0.log

这个错误是由于包依赖关系冲突引起的。根据错误日志，你正在安装 `script-ext-html-webpack-plugin@2.0.1`，它依赖于 `html-webpack-plugin@^3.0.0`。然而，在你的项目中已经安装了 `html-webpack-plugin@4.0.0-alpha`，这与 `script-ext-html-webpack-plugin@2.0.1` 的依赖冲突。

解决这个问题的方法有两种：

1. 更新 `script-ext-html-webpack-plugin`，使其与已安装的 `html-webpack-plugin@4.0.0-alpha` 兼容。你可以查看 `script-ext-html-webpack-plugin` 的文档或 GitHub 页面，看看是否有与 `html-webpack-plugin@4.0.0-alpha` 兼容的版本。

2. 更新 `html-webpack-plugin`，使其与 `script-ext-html-webpack-plugin@2.0.1` 兼容。你可以尝试将 `html-webpack-plugin` 更新到版本 `3.2.0` 或更高版本。

你也可以尝试使用 `--force` 或 `--legacy-peer-deps` 参数运行 `npm install` 命令，但这样可能会导致依赖关系解析不准确或出现其他问题，不推荐使用。

请注意，解决依赖冲突问题可能需要根据你的项目具体情况进行调整，建议仔细阅读错误日志并参考相关文档进行操作。