CC 4.0 ライセンス

このセクションの内容は、以下のリンクの内容から派生したものであり、CC BY 4.0 ライセンスの対象となります。
https://webpack.dokyumento.jp/guides/web-workers/
特に明記されていない限り、以下の内容は元のコンテンツに基づいて変更および削除された結果であると想定できます。

Web Workers

Web Workers は、Rspackの第一級市民です。つまり、Web Workersを直接使用するためにローダーは必要ありません。

使用方法

new Worker(new URL('./worker.js', import.meta.url));

new Worker(new URL('./worker.js', import.meta.url), {
  name: 'my-worker', // <-- When the value of the name property can be statically analyzed, the worker's chunk name can be customized with this property to replace the [name] placeholder when the chunk file is generated
});

new Worker()に加えて、以下の構文もサポートされています。

new SharedWorker()
import { Worker } from "worker_threads": 通常、Node環境で使用されます。
追加バージョン1.0.0-alpha.0
navigator.serviceWorker.register(): サービスワーカーの登録に使用されます。

カスタム構文は、module.parser.javascript.worker を介して提供できます。

例:

情報

この構文は、バンドラーなしでコードを実行できるようにするために選択されました。ブラウザーのネイティブECMAScriptモジュールでも使用できます。

警告

new Worker はURLの文字列表現も受け入れることができますが、RspackではURLの受け渡しのみがサポートされています。
Rspackは、new Worker での変数の使用をサポートしていません。たとえば、次のコードは機能しません。
```
const url = new URL('./path/to/worker.js', import.meta.url);
const worker = new Worker(url);
```
これは、Rspackが構文を静的に解析できないためです。 RspackでWorker構文を使用する場合は、この制限に注意してください。
現在、/* webpackEntryOptions: { filename: "workers/[name].js" } */ マジックコメントはサポートされていません。

worker-loader

警告

worker-loaderは、プロジェクトをRspackに移行しやすくするための一時的なソリューションとしてのみ提供されています。代わりに new Worker() 構文を使用することをお勧めします。

Rspackはworker-loaderもサポートしています。ただし、worker-loader はメンテナンスされていないため、代わりに worker-rspack-loader を使用してください。

resolveLoader を使用して、worker-loader を worker-rspack-loader に置き換えます。

module.exports = {
  resolveLoader: {
    alias: {
      'worker-loader': require.resolve('worker-rspack-loader'),
    },
  },
};

このページの内容

Web Workers#

使用方法#

worker-loader#

Web Workers

使用方法

worker-loader