AudioWorkletProcessor is not defined with React

1k Views Asked by At

So, I want to have a AudioWorkletProcessor in React, and inside it I want to import a package. Here's the worker:

import { Encoder } from "@vocaltale/opus.js";

class PlaybackProcessor extends AudioWorkletProcessor {
  // my AudioWorkletProcessor
}

registerProcessor("playback-processor", PlaybackProcessor);

When trying to import it into a React project, like:

const worker = new Worker("./worklets/record-processor.js");

It throws:

record-processor.js:1 Uncaught ReferenceError: AudioWorkletProcessor is not defined

My guess is that the new Worker() is just for regular workers. So, how do I import a AudioWorkletProcessor? Already tried

const worker = new AudioWorklet("./worklets/record-processor.js");

but

'AudioWorklet' is not defined

The "old" way works fine for creating the worker, but I can't import anything inside it:

const context = new window.AudioContext() || new window.webkitAudioContext();
await context.audioWorklet.addModule("./worklets/record-processor.js");
const recordNode = new AudioWorkletNode(context, "record-processor");

The docs are not helping and I haven't seen any metion to this online. Can someone help?

TL;DR: In React, I need to create a AudioWorkletProcessor that is able to import packages inside.

0

There are 0 best solutions below