我们的应用程序构建在 Next 之上，目前我们正在将音频录制引擎从 Script Processor 迁移到 Audio Worklet API。（当然具有向后兼容性）过渡的一部分也是升级到 Webpack 5。我们正在利用 Web Workers 和 Audio Worklet。在切换到 Webpack 5（它自带对 Workers 的本机支持）之前（至少看起来是这样），我们使用了worker-plugin。它对两者都非常有效，但是随着过渡，我们不能再依赖它，因为它使用过时的 webpack 的 API，并且 Next 附带了自己捆绑的 Webpack 4 和 5，它们似乎不包含向后兼容性。
现在的挑战是让这些与 Next 捆绑在一起的 Webpack 5 一起使用。第一个问题来自网络工作者的全局范围未定义。config.output.globalObject这可以通过设置为来解决"(typeof self !== 'undefined' ? self : this)"。一旦工作人员正常工作，下一个问题就会出现在尝试捆绑工作集的代码时。目前，Webpack 5 不支持工作集导入，但它们公开了解析器配置，可用于告诉 webpack 将其作为工作进程加载，如此Github 问题所示。这将在下一步中失败，除非您还设置了config.output.publicPath = "/_next/";通过加载块时audioContext.audioWorklet.addModule(...)，代码崩溃Uncaught TypeError: Cannot read property 'webpackChunk_N_E' of undefined。如果我们检查包含捆绑工作集代码的块，我们将看到该道具的使用方式如下：
var chunkLoadingGlobal = (typeof self !== 'undefined' ? self : …我正在使用 indexedDB（通过 npm 的 idb 包装器）来存储表示音频通道数据的 2D Float32 数组。它可以正常工作一段时间，但是，当其中一个数组的长度达到大约 时16658432，idb 崩溃，标题中出现异常。堆栈跟踪非常无用，因为我将 React 与 Next.js 结合使用，但是从我发现的情况来看，它似乎在 idb 的缓存部分崩溃了。注意：我可以存储多个大数组没问题，但是一旦它们中的任何一个超过此“限制”，一切都会中断
这是我必须处理的限制，还是可以以某种方式解决？我可以将二维数组分成两个数组并将它们存储为单独的条目，但这是一个不太理想的解决方案，一旦它们增长也会导致同样的问题。
只是围绕 idb 交易的一个简单包装：
export const asyncPut = async (
dbName: string,
tableName: string,
key: string,
value: any // [Float32Array, Float32Array]
): Promise<void> => {
try {
const db = await asyncOpenDb(dbName, tableName);
const transaction = db.transaction(tableName, "readwrite");
await transaction.objectStore(tableName).put(value, key);
} catch (error) {
// I catch the error here
console.error("**IDB Error:", error);
}
};