worker-loader
安装
npm i -D worker-loader
or
yarn add worker-loader --dev
用法
导入 worker 文件：
// main.js
var MyWorker = require("worker-loader!./file.js");
var worker = new MyWorker();
worker.postMessage({a: 1});
worker.onmessage = function(event) {...};
worker.addEventListener("message", function(event) {...});
您还可以使用 inline 参数将 worker 作为 blob 内联：
var MyWorker = require("worker-loader?inline!./myWorker.js");
内联模式将额外为浏览器创建 chunk，但不支持内联 worker，要禁用此行为，只需将 fallback 参数设置为 false：
var MyWorker = require("worker-loader?inline&fallback=false!./myWorker.js");
要设置输出脚本(output script)的自定义名称，请使用 name 参数。该名称可能包含 [hash] 字符串，[hash] 将被替换为，用于缓存目的(caching purpose)、与文件内容相关(content-dependent) hash。例如：
var MyWorker = require("worker-loader?name=outputWorkerName.[hash].js!./myWorker.js");
worker 文件可以像任何其他文件一样导入依赖：
// file.js
var _ = require('lodash')
var o = {foo: 'foo'}
_.has(o, 'foo') // true
// 将数据发送到父线程(parent thread)
self.postMessage({foo: 'foo'})
// 响应来自父线程(parent thread)的消息
self.addEventListener('message', function(event){ console.log(event); });
如果你配置了 babel-loader，你甚至可以使用 ES6 模块：
// file.js
import _ from 'lodash'
let o = {foo: 'foo'}
_.has(o, 'foo') // true
// 将数据发送到父线程(parent thread)
self.postMessage({foo: 'foo'})
// 响应来自父线程(parent thread)的消息
self.addEventListener('message', (event) => { console.log(event); });
维护人员
Tobias Koppers |
Joshua Wiens |
Bogdan Chadkin |