用requirejs未定义烤面包机 [英] toastr undefined with requirejs

问题描述

我正在将带有require.js的toastr.js加载到我的angular项目中，但是它不能用作全局变量.

I am loading toastr.js with require.js in to my angular project however it is not available as global variable.

这是main.js:

require.config({
  baseUrl: 'js',
  paths: {
    domReady: '../lib/requirejs-domready/domReady',
    jquery: '../lib/jquery/jquery',
    jqueryValidate: '../lib/jquery.validation/jquery.validate',
    underscore: '../lib/underscore/underscore',
    bootstrap: '../lib/bootstrap/dist/js/bootstrap',
    moment: '../lib/momentjs/moment',
    toastr: '../lib/toastr/toastr',
    angular: '../lib/angular/angular',
    ngAnimate: '../lib/angular-animate/angular-animate',
    'ui.router': '../lib/angular-ui-router/release/angular-ui-router',
    'chieffancypants.loadingBar': '../lib/angular-loading-bar/build/loading-bar',
    uuid4: '../lib/angular-uuid4/angular-uuid4',
    'ui.bootstrap': '../lib/angular-bootstrap/ui-bootstrap',
    'ui.bootstrap.tpls': '../lib/angular-bootstrap/ui-bootstrap-tpls',
    xeditable: '../lib/angular-xeditable/dist/js/xeditable',
    Restangular: '../lib/restangular/dist/restangular',
    ngCookies: '../lib/angular-cookies/angular-cookies'
  },
  shim: {
    angular: {
      exports: 'angular'
    },
    Restangular: {
      deps: ["underscore", "angular"]
    },
    'ui.router': {
      deps: ['angular']
    },
    'ui.bootstrap': {
      deps: ['angular', 'ui.bootstrap.tpls']
    },
    underscore: {
      exports: '_'
    },
    bootstrap: {
      deps: ['jquery']
    },
    toastr: {
      deps: ['jquery'],
      exports: 'toastr'
    },
    jquery: {
      exports: 'jquery'
    }
  },
  deps: ['boot']
});

boot.js:

define([
  'require',
  'angular',
  'bootstrap',
  'app'
], function (require, ng) {

  'use strict';

  require(['domReady!'], function (document) {
    ng.bootstrap(document, ['wb']);
  });

});

这是app.js中必需的模块.它依靠烤面包机:

Here is the module is required in the app.js. It relies on toastr:

define([
  'angular',
  'ui.router',
  'ngCookies',
  'toastr'
], function (ng) {

  'use strict';

  var module = ng.module('wb.common', [
    'ui.router',
    'ngCookies'
  ]);

  return module;

});

我看到已加载toastr.js，但未将其创建为全局变量.因此，window.toastr是未定义的.我正在用垫片出口toasr ...

I see toastr.js loaded but it is not created as global variable. So window.toastr is undefined. I am exporting in toasr in the shim...

有什么主意为什么taostr不能用作全局变量?

Any ideas why taostr is not available as global variable?

谢谢

推荐答案

没关系，通过查看toastr的源代码(toastr.js的结尾)，它可以作为模块使用.使用Toastr的服务需要从以下位置进行更改:

Never mind, by looking at the source of toastr (end of toastr.js), it makes itself available as module. The service using the toastr needed to change from:

  define(['../module'], function (module) {

  'use strict';

  module.factory('NotifierSvc', ['$log', function ($log) {
    return {
      info: function (msg) {
        toastr.info(msg);
        $log.info(msg);
      },
      warning: function (msg) {
        toastr.warning(msg);
        $log.warn(msg);
      },
      error: function (msg) {
        toastr.error(msg);
        $log.error(msg);
      },
      success: function (msg) {
        toastr.success(msg);
        $log.log(msg);
      }
    }
  }]);

});

对此:

  define(['../module', 'toastr'], function (module, toastr) {

  'use strict';

  module.factory('NotifierSvc', ['$log', function ($log) {
    return {
      info: function (msg) {
        toastr.info(msg);
        $log.info(msg);
      },
      warning: function (msg) {
        toastr.warning(msg);
        $log.warn(msg);
      },
      error: function (msg) {
        toastr.error(msg);
        $log.error(msg);
      },
      success: function (msg) {
        toastr.success(msg);
        $log.log(msg);
      }
    }
  }]);

});

这篇关于用requirejs未定义烤面包机的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！