react、vue中使用webworker

react、vue中使用webworker

项目中，webpack配置，导致webworker.js的文件名、路径发生变化，甚至直接就被合并到某个js文件中去了;导致在浏览器加载的资源中，根本找不到webwork.js这个文件。

如果项目配置太复杂，搞不定配置，可以试试这种方法：

// webwork.js

export default function test() {
    // web work code
    onmessage = function(event) { 
        console.log(event.data)
        // postMessage(1)
    }
}

// page.jsx

import WebworkerFun from './test/webwork.js'

useEffect(() => {
    var blob = new Blob(['(' + WebworkerFun.toString() + ')()'], { type: "application/javascript" });
    var url = URL.createObjectURL(blob);
    var worker = new Worker(url);
    worker.onmessage = function(event) { 
        console.log(event.data)
    }
    worker.postMessage('start')
}, [])