使用 webpacks 时为 dataUri 指定 mime 类型 asset/inline

Question

我正在使用 webpack 加载音频文件asset/inline

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

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

一切正常，文件作为 dataUris 导入。
但是 dataUri 开头为：data:audio/wave;base64,

我需要将 mime 类型更改为 audio/wav（不带尾随 e）以使其与我使用的音频库一起使用。

你能在 webpack 配置中做到这一点，而不是像这样做一些丑陋的事情吗？

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

我尝试将 mimeType 参数添加到规则中，但这根本不起作用...

Answer 1

试试这个解决方案，也许它会奏效：

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

Answer 2

谢谢@grzegorz-t，虽然生成器回调中的内容是原始内容，所以你需要做这样的事情：

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

使用 webpacks 时为 dataUri 指定 mime 类型 asset/inline

specify mime type for dataUri when using webpacks asset/inline

webpack

assets

web-audio-api