Howl is not defined Vue.js 2

I installed howler using

npm install -g  howler --save

Added script

require('howler');

Even in index.html file I added

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.0.4/howler.js"></script>

It seems to work but every time my app reloads (I use npm run serve to run app) I get error Howl is not defined.Then I install howler once again using npm it works, but again after reloading stops working. So basically I need to reinstall howler again and again.

Answer

Installation

The -g flag tells NPM to install the package globally. The --save flag tells NPM to install it locally in your project (and to save it in package.json under dependencies). Those two flags are mutually exclusive, but -g will override --save. The solution there is to remove the -g flag, while keeping --save.

And if you’re requireing it in your project, don’t also import from CDN in index.html (i.e., remove the <script>).

Usage

To use Howl in your code, make sure to assign the return value from require('howler'):

const { Howl } = require('howler');

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

sound.play();

Leave a Reply

Your email address will not be published. Required fields are marked *