0

Hi I am trying to create a fallback for firefox seen as they don't seem to support so one option I've been reading about is importScripts();

In my worker file I have tried to replace these imports:

import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.124/build/three.module.js';
import {texture_splatter} from './texture-splatter.js' ;
import {math} from '/shared/math.mjs';
import {noise} from '/shared/noise.mjs';
import {terrain_height} from '/shared/terrain-height.mjs' ;

with importScripts('/shared/terrain-height.mjs'); etc etc like suggested in this question: Web Workers - How To Import Modules

with got rid of the error

SyntaxError: import declarations may only appear at top level of a module

but now I get this error which completely different to the error in the other question and is showing in the three js lib: SyntaxError: export declarations may only appear at top level of a module three.module.js:51461 from a the lib three.js

I am correct in thinking the above replacing code should work so i can rule that out of being the problem... also if it is three.js has anyone got a solution ?

thanks!

edit: In my script that loads the worker js I load it like this:

export const terrain_builder_threaded = (function() {

  const _NUM_WORKERS = 4;
  let _IDs = 0;
....



 class WorkerThread {
    constructor(s) {
      this._worker = new Worker(s, {type: 'module'});
      this._worker.onmessage = (e) => {
        this._OnMessage(e);
      };
      this._resolve = null;
      this._id = _IDs++;
    }

    _OnMessage(e) {
      const resolve = this._resolve;
      this._resolve = null;
      resolve(e.data);
    }

    get id() {
      return this._id;
    }

    postMessage(s, resolve) {
      this._resolve = resolve;
      this._worker.postMessage(s);
    }
  }

Later on .....

 class _TerrainChunkRebuilder_Threaded {
    constructor(params) {
      this._pool = {};
      this._old = [];

      this._workerPool = new WorkerThreadPool(
          _NUM_WORKERS, 'src/terrain-builder-threaded-worker.js');
  
      this._params = params;
    }

    _OnResult(chunk, msg) {
      if (msg.subject == 'build_chunk_result') {
        chunk.RebuildMeshFromData(msg.data);
        chunk.Show();
      }
    }

Not sure if this way matters or not for firefox... works on chrome atleast

user3112634
  • 523
  • 4
  • 10
  • 26
  • Where did you see `importScripts()` as being recommended in the linked question? `importScripts` imports **classic** scripts, not module ones. You need to create a module Worker by passing `{ type: "module" }` to your `Worker` constructor, as shown in the answers there. But this is not yet supported in Firefox, so for them you need to bundle all your modules as shown in one of the top voted answers there. – Kaiido Jan 17 '23 at 00:51
  • I know it isnt supported in firefox and i already have a worker with the type etc etc hence why i need to use the importScripts as a fallback for firefox – user3112634 Jan 17 '23 at 01:38
  • But Firefox doesn't support module scripts in Web Workers, you need to not use module script, i.e you need to bundle your module scripts in a classic script. As already answered [there](https://stackoverflow.com/a/69808795/3702797). – Kaiido Jan 17 '23 at 02:06

0 Answers0