Incompatibility with Webpack 5

[RunRanger]

When trying to use the music-metadata-browser with webpack 5 serveral errors will appear.

1. Several *.js.map files can't be found anymore.

Error warnings

`Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\apev2\APEv2TagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\apev2\APEv2TagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\apev2\APEv2Token.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\apev2\APEv2Token.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\asf\AsfTagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\asf\AsfTagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\CaseInsensitiveTagMap.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\CaseInsensitiveTagMap.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\CombinedTagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\CombinedTagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\FourCC.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\FourCC.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\GenericTagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\GenericTagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\GenericTagTypes.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\GenericTagTypes.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\MetadataCollector.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\MetadataCollector.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\Util.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\common\Util.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\id3v1\ID3v1TagMap.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\id3v1\ID3v1TagMap.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\id3v2\ID3v22TagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\id3v2\ID3v22TagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\id3v2\ID3v24TagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\id3v2\ID3v24TagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\matroska\MatroskaTagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\matroska\MatroskaTagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\matroska\types.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\matroska\types.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\mp4\MP4TagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\mp4\MP4TagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\ogg\vorbis\VorbisTagMapper.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\ogg\vorbis\VorbisTagMapper.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\riff\RiffInfoTagMap.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\riff\RiffInfoTagMap.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\type.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\music-metadata\lib\type.js.map'

Failed to parse source map from 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\readable-web-to-node-stream\lib\index.js.map' file: Error: ENOENT: no such file or directory, open 'D:\Programmierung\JS_React\delete\music-analyzer\node_modules\readable-web-to-node-stream\lib\index.js.map'`

This can be fixed temporarly by setting the enviroment variable
GENERATE_SOURCEMAP=false

2. Parsing won't be working anymore since buffer isn't supported anymore (?)
   https://stackoverflow.com/questions/67009449/after-upgrading-webpack-to-version-5-getting-run-time-error-buffer-is-not-defin

Uncaught (in promise) ReferenceError: Buffer is not defined at new MpegParser (MpegParser.js:218:1) at Function.loadParser (ParserFactory.js:148:1) at parse (ParserFactory.js:36:1) at Function.parse (ParserFactory.js:79:1) at Function.parseOnContentType (ParserFactory.js:55:1) at async parseReadableStream (index.js:31:1)

This error makes it nearly impossible to use this libary with the newest CRA of React or any other projects which rely on webpack5.

To reproduce the error you just have to setup the basic react-app and try to implement music-metadata-browser.

[Borewit]

There should not be any *.js.map files in music-metadata-browser. Should be bundles with pure JavaScript only. Looks like these files are coming from Webpack.

Does this help?: How to polyfill Buffer with Webpack 5

This is working example with REACT 17: https://github.com/Fuchsoria/testmetadata (borrowed from music-metadata issue #1028)

[RunRanger]

Thank you for your fast response.

I believe those *.js.map-files are dependencies of music-metadata.

Unfortunately I have to inject the configuration because of using the latest create-react-app.
The example of Fuchsoria downgraded to react-scripts 4.0 instead of using the latest 5.0.

[Borewit]

There are no *.js.map present in music-metadata neither, restricted to *.js & *.d.ts.

Source maps (*.js.map) are used to correlate original source and target source. The target source never depends on source map files.

As soon as a I have time I will try to investigate the issue.