使用Webworker时出现Webpack警告:具有运行时的块之间的循环依赖关系

dy1byipe  于 2022-11-24  发布在  Webpack
关注(0)|答案(1)|浏览(346)

我在一个项目中使用Webpack 5,并试图将一些逻辑移到WebWorker中。

persistenceWorker = new Worker(
  new URL('app/engine/persistence/worker', import.meta.url),
);

然而,我现在从webpack中得到了这样的警告:

Circular dependency between chunks with runtime (main, src_app_engine_index_ts)
This prevents using hashes of each other and should be avoided.

看起来这是因为我的worker文件导入的代码传递性地导入了创建worker的文件。我不认为这在我的程序架构中是可以避免的。虽然我不认为这是一个问题--没有任何东西导入worker模块,所以引用应该都是一个方向的。看起来像是将创建worker作为依赖项计算在内。即使创建worker的文件实际上并没有导入worker文件中的代码。
有没有办法解决这个问题?重构我的项目以删除"循环依赖项"可能是不可行的。
如果我关闭这个警告,一切都正常,我不清楚"这阻止使用彼此的哈希"在实际中是什么意思。

u1ehiz5o

u1ehiz5o1#

我认为是某个webpack插件导致了此问题。要检测此问题,您可以使用circular-dependency-plugin
在复杂的软件中,循环依赖通常是必要的,循环依赖的存在并不总是意味着bug,但是在你认为bug存在的情况下,这个模块可以帮助你找到它。

// webpack.config.js
const CircularDependencyPlugin = require('circular-dependency-plugin')
 
module.exports = {
  entry: "./src/index",
  plugins: [
    new CircularDependencyPlugin({
      // `onStart` is called before the cycle detection starts
      onStart({ compilation }) {
        console.log('start detecting webpack modules cycles');
      },
      // `onDetected` is called for each module that is cyclical
      onDetected({ module: webpackModuleRecord, paths, compilation }) {
        // `paths` will be an Array of the relative module paths that make up the cycle
        // `module` will be the module record generated by webpack that caused the cycle
        compilation.errors.push(new Error(paths.join(' -> ')))
      },
      // `onEnd` is called before the cycle detection ends
      onEnd({ compilation }) {
        console.log('end detecting webpack modules cycles');
      },
    })
  ]
}

相关问题