1

I'm trying to include a javascript library (WaveSurfer) into my Angular app (Using Mean.io). The problem is a warning appears into the console each time I run grunt :

In packages\tracks\public\services\tracks.js : 'WaveSurfer' is not defined.

Here is the code of my different files:

public/controllers/tracks.js

angular.module('mean').controller('PlayerController', ['$scope', 'Global', 'Tracks','myWaveSurfer',
function($scope, Global,Tracks, myWaveSurfer) {
    $scope.global = Global;

    //Player WaveSurfer
    var wavesurfer = Object.create(myWaveSurfer);
    wavesurfer.load('music.mp3');

public/services/tracks.js

angular.module('mean.tracks').factory('myWaveSurfer', function() {
    return WaveSurfer; /*Warning here*/
});

The content of the wavesurfer.min.js looks like :

var WaveSurfer = {
   defaultParams: {...}
   init: function(params) {...}
   ...
}

I included correctly the library into config/assets.json so the library can be loaded. I can see it on the Chrome console :

<script type="text/javascript" src="/bower_components/wavesurfer.js/build/wavesurfer.min.js"></script>

It only works with grunt --force but is there a solution to include properly this library without warning ?

Thanks in advance !

Olivier Nguyen
  • 141
  • 7
  • Hard to tell from what you pasted, but is this an error coming from jshint/jslint? In that case you should be able to declare WaveSurfer as a global in the gruntfile. – ivarni Jul 30 '14 at 13:36
  • Thanks you @ivarni ! I just added `/* global WaveSurfer: true */` on the top of my services/tracks.js and the warning disappears. Thanks you again ! It is a nice answer. – Olivier Nguyen Jul 30 '14 at 13:59

1 Answers1

0

I assume you are inside the Node env.

Add this to your globals:

GLOBAL.WaveSurfer = {};

Or you could pull it in with require

GLOBAL.WaveSurfer = require('...');

If you require make sure the library module.exports the global object.

beautifulcoder
  • 10,832
  • 3
  • 19
  • 29