Skip to content

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

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

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions