worker-loader Inline 做什么?

What Does worker-loader Inline Do?

我的理解是以下 Webpack worker-loader 配置:

...
module: {
    rules: [
        {
            test: /worker\.js/,
            loader: "worker-loader",
            options: {
                inline: 'fallback',
            }
        }
        { ... }
    ]
}
...

会将工作文件(在本例中名为 worker.js)与其他 JS 文件捆绑到输出文件中,从而产生单个文件输出。然后使用

在应用程序中加载文件
import Worker from "worker-loader!./worker.js";

将成功加载 Worker。测试了一下,好像是我理解错了。 inline 不将worker打包成一个文件;它在输出目录中创建一个单独的文件。

那么,inline 到底在做什么?

存在内联加载程序语法,允许您在特定实例中覆盖项目中 worker 的默认配置。这可能包括为网络工作者分配文件名以输出之类的事情。

它在 Webpack@4.x 中更有用。现在 Webpack@5.x 已经出来了,使用内联加载器的理由越来越少。

更重要的是,Webpack@5.x不需要worker loader。

但现在有一些可能不受欢迎的消息 - 工作人员必须始终在他们自己的独立文件中,除非您将它们作为 blob 加载,这可能会对您的 site/application.