aws-doc-sdk-examples icon indicating copy to clipboard operation
aws-doc-sdk-examples copied to clipboard

microphone-stream (used in transcribe-streaming-app) missing polyfills in Webpack 5

Open Rica02 opened this issue 1 year ago • 0 comments

I'm trying to get the transcribe-streaming-app example working into my create-react-app project, using Typescript and Webpack 5.

I get the following error:

_stream_readable.js:490 Uncaught (in promise) ReferenceError: process is not defined
    at emitReadable (_stream_readable.js:490:1)
    at onEofChunk (_stream_readable.js:469:1)
    at readableAddChunk (_stream_readable.js:240:1)
    at Readable.push (_stream_readable.js:228:1)
    at MicrophoneStream.stop (microphone-stream.js:157:1)
    at Module.stopRecording (transcribeClient.js:41:1)
    at stopRecording (App.tsx:39:1)
    at startRecording (App.tsx:33:1)

This is issue is cased by the microphone-stream package, which also has an open thread about it. The reason for this issue, as outlined in this reply:

  • Webpack versions < 5 used to include NodeJS polyfills by default.
  • The current version of Webpack no longer includes NodeJS polyfills by default.
  • If you use the latests versions of create-react-app it will use the latest version of webpack, this causes isues to build applications that use some node methods like process, buffer, etc., many web3 projects also faced this problem (alchemyweb3.js and web3.js).

I was wondering if there is any workaround for this, or alternative packages that I can use for my project.

Rica02 avatar Feb 09 '24 00:02 Rica02