Can't resolve worker_threads

niklashaa commented 9 months ago

Environment

Nuxt project info: 17:59:58

Operating System: Linux
Node Version: v18.18.0
Nuxt Version: 2.17.3
CLI Version: 3.10.1
Nitro Version: 2.9.1
Package Manager: yarn@1.22.19
Builder: webpack
User Config: bridge, plugins, serverHandlers, devServerHandlers, devServer, typescript, nitro, buildModules
Runtime Modules: -
Build Modules: (), @nuxt/bridge@3.0.1

Reproduction

https://stackblitz.com/edit/nuxt-starter-yap9cm

Describe the bug

Moving to nuxt-bridge causes the following console error when vuelayers plugin is imported.

This dependency was not found:                                                                                                          
* worker_threads in ./node_modules/web-worker/node.js

nuxt.config.js:

plugins: [
    { src: '@/plugins/vuelayers.js', mode: 'client' },
  ],

vuelayers.js:

import Vue from 'vue';
import VueLayers from 'vuelayers';

Vue.use(VueLayers);

Additional context

No response

Logs

No response

davebot9000 commented 6 months ago

I am also having this issue. I am not using vuelayers BUT I am using openlayers module

niklashaa commented 5 months ago

I'm collecting a little what I found here. I'm kind of a beginner to all of this so please apologize if all of this isn't helpful.

According to this Stackoverflow answer worker_threads have been introduced to node in v12. In my package.json I'm using

  "engines": {
    "node": "^20.11"
  },

So this can't really be the issue.

An issue with the same error message has been resolved once here by setting an alias in nuxt.config.js like so:

export default defineNuxtConfig({
  plugins: [{ src: '~/plugins/jspdf.client.js', mode: 'client' }],
  alias: {
    // Comment out to reproduce
    fflate: 'fflate/esm/browser.js',
  },
});

How I understand the answer the fflate package somehow imported an old version of node in the browser build of nuxt so that worker_threads could not be found. By aliasing it to a specific file this can be avoided.

Not sure how this should be done in our case with web-worker. The naive approach, replacing "fflate" with "web-worker" like the following does not work:

  alias: {
    "web-worker": "web-worker/esm/browser.js",
  },

I was thinking maybe I can somehow update the web-worker package manually in yarn.lock but the newest version seems to be already installed

web-worker@^1.2.0:
  version "1.3.0"
  resolved "https://registry.yarnpkg.com/web-worker/-/web-worker-1.3.0.tgz#e5f2df5c7fe356755a5fb8f8410d4312627e6776"
  integrity sha512-BSR9wyRsy/KOValMgd5kMyr3JzpdeoR9KVId8u5GVlTTAtNChlsE4yTxeY7zMdNSyOmoKBv8NH2qeRY9Tg+IaA==

niklashaa commented 5 months ago

I updated the reproduction link. The error goes away when web-worker is imported directly with a server plugin and reappears when that plugin is turned to a client plugin:

plugins/web-worker.js:

import Worker from 'web-worker';
export default new Worker();

nuxt.config.js:

plugins: [
    { src: '@/plugins/web-worker.js', mode: 'server' }, // this works
    // { src: '@/plugins/web-worker.js', mode: 'client' }, // this doesn't
  ],

I guess that is to be expected since worker threads should only work on the server. Maybe by using nuxt bridge server threads are accidentally imported on the client.

nuxt / bridge