时间:2022-9-14 作者:悬浮的青春 分类: javascript
1.安装 worker-loader
yarn add worker-loader -D
npm install worker-loader -D
2.配置 vue.config.js
chainWebpack: (config) => {
config.plugin("html").tap(args => {
args[0].title = "HTML标题";
return args;
});
config.module.rule("worker").test(/\.worker\.js$/).use("worker-loader").loader("worker-loader").end();
config.module.rule('js').exclude.add(/\.worker\.js$/);
config.output.globalObject('this');
},
3.demo.worker.js
console.log(self)
addEventListener('message', function (e) {
console.log(e, "message")
const { data } = e;
switch (data.route) {
case "end":
self.close();
break;
default:
console.log("default");
}
}, false);
4.使用
<script setup name="Home">
import demoWorker from "@/worker/demo.worker";
const worker = new demoWorker();
worker.postMessage({ name: "demo", age: 18 });
</script>