wolf

Javascript audio library for the modern web. Port of howler.js in TypeScript (ESM)

Drop in replacement for Howler.js

What is different from original Howler.js

• Written in TypeScript (better type safety)
• Compatible with Google Closure Compiler
• ESM only
• WebAudio only, removed HTML5 audio
• Howl src accepts ArrayBuffer
• HowlOptions has onloadprogress callback for sound download progress
• Separate get method for loop, rate, seek, volume (avoid function overloading)
• Minor bug fixes (like iOS 26)

Breaking

• no global Howler instance, instead it is a class now. Check usage below.

Install

NPM

npm install --save @goldenratio/wolf

https://www.npmjs.com/package/@goldenratio/wolf

Usage

Basic Usage:

import { Howl, Howler } from '@goldenratio/wolf';

// create howler instance
const howler = new Howler();

// you need to pass `howler` instance to `Howl`
const sound = new Howl({
    src: ['sound.mp3']
  },
  howler
);

sound.play();

import { Howler } from '@goldenratio/wolf';

const howler = new Howler();

// convenience method to create `Howl` from `howler`
const sound = howler.createHowl({
  src: ['sound.mp3']
});

sound.play();

More playback options:

const sound = new Howl({
    src: ['sound.webm', 'sound.mp3', 'sound.wav'],
    autoplay: true,
    loop: true,
    volume: 0.5,
    onend: () => {
      console.log('Finished!');
    }
  },
  howler
);

Define and play a sound sprite:

const sound = new Howl({
    src: ['sounds.webm', 'sounds.mp3'],
    sprite: {
      blast: [0, 3000],
      laser: [4000, 1000],
      winner: [6000, 5000]
    }
  },
  howler
);

// Shoot the laser!
sound.play('laser');

Listen for events:

const sound = new Howl({
    src: ['sound.webm', 'sound.mp3']
  },
  howler
);

// Clear listener after first call.
sound.once('load', () => {
  sound.play();
});

// Fires when the sound finishes playing.
sound.on('end', () => {
  console.log('Finished!');
});

Control multiple sounds:

const sound = new Howl({
    src: ['sound.webm', 'sound.mp3']
  },
  howler
);

// Play returns a unique Sound ID that can be passed
// into any method on Howl to control that specific sound.
const id1 = sound.play();
const id2 = sound.play();

// Fade out the first sound and speed up the second.
sound.fade(1, 0, 1000, id1);
sound.rate(1.5, id2);

Release

NPM

npm version {major | minor | patch}
npm publish

# If you have ignore-scripts enabled
npm version {major | minor | patch}
npm run version
npm run postversion
npm publish