Question

我正在构建一个模块，我想为使用AMD的人和不使用AMD的人提供这些模块。例如，我想让它与RequireJS一起使用：

require(['Module'], function (Module) {
  // do stuff with module
});

但我也想通过手动插入所有依赖项来工作（考虑到它们在没有AMD的情况下也可以工作）。

如何测试此行为是否正确？

Answer 1

我发现一种工作方法是在我的脚本文件中使用模块模式，以便没有泄漏的依赖项。然后，我构建了一个内部函数，它接收我的依赖项作为参数，并返回表示我想要导出的模块的对象。

然后，我检查是否有可用的define函数，以及是否设置了amd属性。如果是，那么我使用define注册模块，否则我将其导出为全局。

这是代码的骨架。我们假设模块名为Module，它有两个依赖项，dep1和dep2：

(function (exports) {
  "use strict";
  var createModule = function (dep1, dep2) {
    var Module;
    // initialize the module
    return Module;
  }
  if (typeof define === 'function' && define.amd) {
    define(['dep1', 'dep2'], function (dep1, dep2) {
      return createModule(dep1, dep2);
    });
  } else {
    exports.Module = createModule(dep1, dep2);
  }
})(this);

关于测试，我目前正在使用yeoman，mocha和PhantomJS。以下是如何使用require进行测试。我用来测试两种情况（有和没有AMD）的方法是进行两次单独的html测试。首先，您需要在Gruntfile中添加第二页：

// headless testing through PhantomJS
mocha: {
  all: ['http://localhost:3501/index.html', 'http://localhost:3501/no-amd.html']
},

在第一种情况下，有正常的基于需求的模板：

<script src="lib/mocha/mocha.js"></script>
<!-- assertion framework -->
<script src="lib/chai.js"></script>

<!-- here, main includes all required source dependencies, 
    including our module under test -->
<script data-main="scripts/main" src="scripts/vendor/require.js"></script>

<script>
  mocha.setup({ui: 'bdd', ignoreLeaks: true});
  expect = chai.expect;
  should = chai.should();
  require(['../spec/module.spec'], function () {
    setTimeout(function () {
      require(['../runner/mocha']);
    }, 100);
  });
</script>

为了测试非amd，我们需要明确包含模块和所有依赖项。在页面中出现所有内容后，我们会包含跑步者。

<script src="lib/mocha/mocha.js"></script>
<!-- assertion framework -->
<script src="lib/chai.js"></script>

<!-- include source files here... -->
<script src="scripts/vendor/dep1.js"></script>
<script src="scripts/vendor/dep2.js"></script>
<script src="scripts/Module.js"></script>

<script>
  mocha.setup({ui: 'bdd', ignoreLeaks: true});
  expect = chai.expect;
  should = chai.should();
</script> 
<script src="spec/romania.spec.js"></script>
<script src="runner/mocha.js"></script>

拥有两个不同的规格没有任何意义，但规范也适用于AMD而没有它。解决方案类似于我们用于模块的解决方案。

(function () {
  "use strict";
  var testSuite = function (Module) {
    // break the module into pieces :)
  };
  if (typeof require === 'function') {
    require(['Module'], function (Module) {
      testSuite(Module);
    });
  } else {
    // if AMD is not available, assume globals
    testSuite(Module);
  }
})();

如果您有不同或更优雅的方法，请在此处将其作为答案发布。我很乐意接受更好的答案。：）

如何为JavaScript模块提供有条件的AMD支持？

1 个答案: