specify mime type for dataUri when using webpacks asset/inline

Question

I'm loading audio files with webpacks asset/inline

{
  test: /\.(wav)$/i,
  type: 'asset/inline',
}

import someWAV from './wav/some.wav'

working all fine, files get imported as dataUris.
But the dataUri beginning with: data:audio/wave;base64,

I need to change the mime-type to audio/wav (without the trailing e) to make it work with the audio library I use.

Can you do that in the webpack config, rather than doing something ugly like this?

someWAV = someWAV.replace('audio/wave', 'audio/wav')

I tried just adding the mimeType parameter to the rule, but that didn't work at all...

Answer 1

thanks @grzegorz-t, content in the generator callback is the raw content though, so you need to do something like this:

{
  test: /\.wav/,
  type: 'asset/inline',
  generator: {
    dataUrl: (content) => {
      return `data:audio/wav;base64,${content.toString('base64')}`
    },
  },
}

Answer 2

Try this solution, maybe it will work:

{
  test: /\.wav/,
  type: "asset/inline",
  generator: {
    dataUrl: (content) => {
      content = content.replace('audio/wave', 'audio/wav');
      return content;
    }
  }
};