在vue项目中不能直接使用web worker，需要使用vue-worker这个库。它提供了run、create等API方便我们使用。 在项目中安装完vue-worker后，需要先注册，注册完之后可以通过this.$worker来使用。
安装插件
npm install vue-worker --save
main.js引用
import VueWorker from 'vue-worker'
Vue.use(VueWorker)
在组件中使用，直接this.$worker就可以使用
在组件中调用worker, 有run和create两个API，run方法直接新建worker, worker执行完任务后自动关闭worker线程。而通过create方法创建的worker会持久化运行。
/*
API：run()方法的使用，第一个参数是一个函数，用于处理数据，第二个参数是一个数组，是函数的实参。run方法执行一次就会断开，支持promise
*/
this.$worker.run((n, b) => n + 10 + b, [2, 10]).then(res => {
console.log(res)
})
/*
API：create()方法，可以持久化worker，接收一个数组参数，数组中是每一个对象，对象中是id和方法
*/
worker: null,
action: [{
message: 'abc',
func (data) {
return data
}
}, {
message: 'msg',
func (data) {
return data
}
}]
this.worker = this.$worker.create(this.action)
// postMessage实例对象方法，第一个参数是要触发那个对象中的方法，第二个参数是传递给方法中的实参
this.worker.postMessage('msg', [{ name: '哈哈哈' }]).then(res => {
console.log(res)
})
/*
API：postAll实例方法，如果不传递参数，会触发所有对象中的方法，参数可以是字符串，或者对象和数组
*/
// 数组参数：数组中必须是对象，message属性标示触发那个方法，第二个属性args是给方法传递的实参
this.worker.postAll([{ message: 'pull-data', args: [{ name: '小兰' }] }])
.then((res1, res2) => {
console.log(res1)
})
// 字符串形式
this.worker.postAll('pull-data')
.then((res1, res2) => {
console.log(res1)
})
/*
API；register实例方法，可以动态注册方法和标示
*/
this.worker.register({ message: 'copu', func: () => 1 })
// unregister方法可以取消注册
this.worker.unregister('copu')
this.worker.unregister('pull-data')
参考
vue中使用web worker
在Vue中使用Web Worker
vue-worker
vue-worker的使用
vue中使用web worker踩坑
