Nuxt 3 Web Worker

Question

我的 Nuxt 3 应用程序需要运行一些可能繁重的与字符串相关的计算，所以我想将它们移到工作线程中：

// /assets/workers/test.ts

// import someStuff from "my-package-in-node_modules"

console.log('Hello from worker!');

onmessage = () => {
    /* Do stuff... */
}

这就是我在 Vue 页面上添加工作人员的方式：

<script setup lang="ts">
    import MyWorker from "~/assets/workers/test?worker";

    const worker = new MyWorker();
</script>

但是，当我尝试打开该页面时，它显示 500 错误，并伴有

Worker is not defined

消息。

我的猜测是它无法在服务器端创建worker并抛出错误。所以也许我需要以某种方式仅在客户端运行这部分代码。

我该如何解决这个问题？

Answer 1

由于Nuxt无法在服务器端创建worker，因此必须在客户端创建worker：

if (process.client)
{
    const worker = new MyWorker();
}