Skip to content

Using Webpack 5 for web worker loading example is brokenΒ #2

@kerel-fs

Description

@kerel-fs

🐞 Problem

While following the Getting Started guide I failed to use the native worker support introduced with Webpack 5. Following the Webpack 4 approach of loading web workers using worker-loader works though.

πŸ—’οΈ Steps to reproduce

The files at kerel-fs/spectranalysis@eb1e672 contain the example project of spectroplot-js, running fine while using worker-loader. Changing ./src/easy.js#L14 from

import spectroplot_worker from 'worker-loader?filename=js/spectroplot.[hash].worker.js!spectroplot/lib/worker.js'

to

const SpectroplotWorker = Worker(new URL('spectroplot/lib/worker.js', import.meta.url))

(as described in the README) will generate the following error on page load:

Uncaught TypeError: Worker constructor: 'new' is required
    <anonymous> webpack://demo3/./src/easy.js?:21
    js http://localhost:8080/example.bundle.js:495
[...]

# For context, src/easy.js#L21:
spectroplot_worker = Worker(new URL(/* asset import */ __webpack_require__(/*! spectroplot/lib/worker.js */ "./node_modules/spectroplot/lib/worker.js"), __webpack_require__.b));

πŸ’‘ Possible solutions

My first attempt at a quick fix was to just create a new Worker instance by using the new operator (#1). This does not work since spectroplot-js itself tries to create instances of workerOrUrl:

renderWorker[i] = (typeof workerOrUrl === 'string') ? new Worker(workerOrUrl) : new workerOrUrl()

Probably some adjustment is needed here for the native web worker support of Webpack 5, but I didn't come of with a working patch yet.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions