Error while using audioencoder library in an vue3 app

Question

I need to use audioEncoder library in a Vue3 app.

https://www.npmjs.com/package/audio-encoder

I installed audioEncoder using "npm install audio-encoder"

I see the library under the "node_modules"

I am able to import this as:

import { audioEncoder } from "audio-encoder";

The following line gives an error:

    const ae = new audioEncoder();
    ae.encode(audioBuffer, 128, null, function onComplete(blob) {
      console.log(blob);
    });

The error message is: audioEncoder is not a constructor

I also tried:

    audioEncoder.encode(audioBuffer, 128, null, function onComplete(blob) {
      console.log(blob);
    });

this gives the following error: TypeError: Cannot read properties of undefined (reading 'encode')

Any recommendations on what's the best way to use this library.

Thanks!

yoduh · Accepted Answer · 2022-09-11 03:10:31Z

1

I used the example code from the npm page. This code will "work":

<script setup>
import audioEncoder from 'audio-encoder';

// create audioBuffer
const audioContext = new AudioContext();
const length = 44100; // one second @ 44.1KHz
const audioBuffer = audioContext.createBuffer(1, length, 44100);
const channelData = audioBuffer.getChannelData(0);

// fill some audio
for (let i = 0; i < length; i++) {
  channelData[i] = Math.sin(i * 0.03);
}

// convert as mp3 and save file using file-saver
audioEncoder(audioBuffer, 128, null, function onComplete(blob) {
  fileSaver.saveAs(blob, 'sound.mp3');
});
</script>

I say "work" in quotations because it seems it would work if it wasn't for a known issue with the library reported here

In my opinion this library seems broken and does not look to be supported by it's author anymore. I would suggest looking for a new library, preferably one that advertises itself as Vue compatible if you can.

answered Sep 11, 2022 at 3:10

yoduh

15.5k2 gold badges23 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

VV75 Over a year ago

Thanks! I used lamejs and ran into the issue that you mention above. Looks like audio-encoder uses the same underlying library.

VV75 Over a year ago

Accepting your response since the syntax works. What’s the difference in import {abc} and import abc.

yoduh Over a year ago

the syntax to use depends on how the thing you're importing was originally exported. there are two types of exports and imports "named" (require curly braces when importing) and "default" (no curly braces).

Collectives™ on Stack Overflow

Error while using audioencoder library in an vue3 app

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related