From 64ba0b4130e886d8b9890ebaa4c4087d91bedf4d Mon Sep 17 00:00:00 2001 From: Johannes Marbach Date: Mon, 13 Nov 2023 19:39:45 +0100 Subject: [PATCH] Squashed commit of the following: commit 01a62b36a484d65664a641c4db2a7f3373251b47 Merge: 10edf06898 74961dbfb1 Author: Johannes Marbach Date: Mon Nov 13 19:38:47 2023 +0100 Merge branch 'johannes/webpack5-workers' into johannes/worklet-path commit 10edf068980f11b99bf2b18dce72e27065fd5727 Author: Johannes Marbach Date: Sun Nov 12 12:21:43 2023 +0100 Document syntax and use .ts commit 4040f2ce4121ddaf5254cb68e2e9b8716b0431d0 Author: Johannes Marbach Date: Sat Nov 11 21:38:09 2023 +0100 Switch to URL and use syntax compatible with Webpack commit b4f96f17cc1819bd84b8e6735a8c3f69948e97c4 Merge: eed2ffdc1c 94484692f8 Author: Johannes Marbach Date: Thu Nov 9 21:04:06 2023 +0100 Merge branch 'develop' into johannes/worklet-path commit eed2ffdc1c27e8748719b64e002c44e3dc6500e7 Author: Johannes Marbach Date: Thu Nov 9 21:03:45 2023 +0100 Restore unused import to fix dead code analysis commit 689cea2f061120070f3db405289bd9ded108def5 Author: Johannes Marbach Date: Thu Nov 9 16:50:56 2023 +0100 Use literal path in audioWorklet.addModule for compatibility with Webpack 5 --- src/audio/VoiceRecording.ts | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/audio/VoiceRecording.ts b/src/audio/VoiceRecording.ts index 2e1f5634fb..53656c1a34 100644 --- a/src/audio/VoiceRecording.ts +++ b/src/audio/VoiceRecording.ts @@ -28,6 +28,10 @@ import { UPDATE_EVENT } from "../stores/AsyncStore"; import { createAudioContext } from "./compat"; import { FixedRollingArray } from "../utils/FixedRollingArray"; import { clamp } from "../utils/numbers"; +// This import is needed for dead code analysis but not actually used because the +// built-in worker / worklet handling in Webpack 5 only supports static paths +// @ts-ignore no-unused-locals +// eslint-disable-next-line @typescript-eslint/no-unused-vars import mxRecorderWorkletPath from "./RecorderWorklet"; const CHANNELS = 1; // stereo isn't important @@ -129,7 +133,13 @@ export class VoiceRecording extends EventEmitter implements IDestroyable { if (this.recorderContext.audioWorklet) { // Set up our worklet. We use this for timing information and waveform analysis: the // web audio API prefers this be done async to avoid holding the main thread with math. - await this.recorderContext.audioWorklet.addModule(mxRecorderWorkletPath); + + // The audioWorklet.addModule syntax is required for Webpack 5 to correctly recognise + // this as a worklet rather than an asset. This also requires the parser.javascript.worker + // configuration described in https://github.com/webpack/webpack.js.org/issues/6869. + const audioWorklet = this.recorderContext.audioWorklet; + await audioWorklet.addModule(new URL("./RecorderWorklet.ts", import.meta.url)); + this.recorderWorklet = new AudioWorkletNode(this.recorderContext, WORKLET_NAME); this.recorderSource.connect(this.recorderWorklet); this.recorderWorklet.connect(this.recorderContext.destination);