Skip to content

Importing The Worklet

spessasus edited this page Oct 18, 2024 · 2 revisions

Importing the worklet module

Warning

Make sure you always update worklet_processor.min.js along with the npm package!

The problem

the addModule method uses URL relative to the page URL, so I (the creator) can't simply just do

async function addWorkletHelper(context)
{
    await context.audioWorklet.addModule("./worklet_processor.min.js")
}

This forces us to import the worklet manually

Tip

If you know a better way of doing this, please let me know!

The Solution

It depends on how you installed the library.

Copied spessasynth_lib folder

Use the helper constant for the worklet script.

import { WORKLET_URL_ABSOLUTE } from "./spessasynth_lib/synthetizer/worklet_url.js"
await context.audioWorklet.addModule(new URL("/path/to/spessasynth_lib/" + WORKLET_URL_ABSOLUTE, import.meta.url));

Replace path/to/spessasynth_lib/ with the actual library path. Remember the slash at the end!

Tip

This method works with ESBuild.

Npm package

Copy the worklet_processor.min.js from spessasynth_lib/synthetizer to your destination, for example src folder.

await context.audioWorklet.addModule("./worklet_processor.min.js");

Tip

This method seems work with webpack.