javascript - RequireJs 依赖总是未定义

Question

我正在使用 require Js，我对为什么我的模块正在加载但依赖项总是未定义感到相当困惑，甚至在使用 require.defined() 函数检查我的模块是否已加载时它确实已经加载但是当我使用 require([deps], function(deps){});我所有的依赖项都是未定义的(jquery、underscore 和 knockout 除外)

我的文件结构如下 我的文件结构如下

scripts 
    |
    |        
    main.js
    |
    |_________BusinessScripts
    |           |
    |           |
    jquery.js   |
    |           |
    |           boostrapper.js-undefined
    ko.js       |
                |
                dataservice.js-undefined

这是我的主文件的一个示例，它启动了 require

requirejs.config(
    {
        paths: {
            'jquery': 'jquery-1.7.1',
            'underscore': 'underscore',
            'ko': 'knockout-2.2.1'
        },
        shim: {
            underscore: { exports: '_' },
        }
    }
);


requirejs(['require', 'BusinessScripts/bootstrapper', 'BusinessScripts/dataservice'],
function (require,bootstrapper, dataservice) {

    var def = require.defined('BusinessScripts/bootstrapper'); //this returns true

    if (dataservice !== undefined) { // always undefined

        alert("Loaded properly");
    } else {
        alert("not loaded!!!");
    }

    if (bootstrapper !== undefined) { // always undefined


        alert("Loaded properly");
    } else {
        alert("not loaded!!!");
    }

});

我的数据服务类做了一个相当长的 jquery get 但作为一个简单的例子，我的 Bootstrap 几乎什么都没做

//bootstrapper
define(function () { var one = 1; 
var run = function () {
}
});

//dataservice

define(['jquery', 'underscore'],function ($, _) {
    $.ajax({lengthy work...});

});

正如我所说，两个模块都在加载但从未解析

如有任何帮助，我们将不胜感激。

Answer 1

您没有从bootstrapper 或dataservice 模块返回任何内容，因此该模块的“公共(public)”部分是未定义。 RequireJS 简单地执行 define 函数的主体并隐式返回 undefined。我认为一个很好的类比是将模块想象成一个隐藏所有内部结构的黑盒子，只允许通过公共(public)接口(interface)访问(这是您从模块的最终 return 语句返回的任何内容)

你应该稍微重写你的模块，例如:

bootstrapper.js

define(function () {
  var one = 1;
  var run = function () {
    console.log('Running...');
  }

  return {
    publicRun: run,
    publicOne: one
  }
});

dataservice.js

define(['jquery', 'underscore'],function ($, _) {
  $.ajax({
    // lengthy work...
  });

  return 'Lengthy work started!';
});

然后你可以像这样使用这些模块:

requirejs(['require', 'BusinessScripts/bootstrapper', 'BusinessScripts/dataservice'],
  function (require, bootstrapper, dataservice) {
    // prints "1"
    console.log(dataservice.publicOne);

    // prints "Running..."
    dataservice.publicRun();

    // prints "Lengthy work started!"
    console.log(bootstrapper);
  });

---

official docs详细介绍了定义模块的主题，我建议您在深入研究之前尽可能多地阅读文档。