未定义外部库变量答案

【问题标题】：External library variable not defined未定义外部库变量
【发布时间】：2014-07-30 13:35:13
【问题描述】：

我正在尝试将 javascript 库 (WaveSurfer) 包含到我的 Angular 应用程序 (Using Mean.io) 中。问题是每次我运行grunt 时控制台都会出现警告：

在 packages\tracks\public\services\tracks.js 中： 'WaveSurfer' 未定义。

这是我不同文件的代码：

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*/
});

wavesurfer.min.js 的内容如下：

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

我将库正确地包含在config/assets.json 中，因此可以加载该库。我可以在 Chrome 控制台上看到它：

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

它仅适用于 grunt --force，但有没有解决方案可以在不发出警告的情况下正确包含此库？

提前致谢！

【问题讨论】：

很难从您粘贴的内容中分辨出来，但这是来自 jshint/jslint 的错误吗？在这种情况下，您应该能够在 gruntfile 中将 WaveSurfer 声明为全局变量。
谢谢@ivarni！我刚刚在我的 services/tracks.js 顶部添加了/* global WaveSurfer: true */，警告就消失了。再次感谢您！这是一个很好的答案。

标签： javascript angularjs gruntjs mean-stack

【解决方案1】：

我假设你在 Node 环境中。

将此添加到您的全局变量中：

GLOBAL.WaveSurfer = {};

或者你可以用require拉进来

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

如果你 require 确保库 module.exports 是全局对象。

【讨论】：