javascript - 如何使用curl.js加载对象？

Question

Curl 0.7.3

我从这里得到了一些 AMD/CommonJS 适配器代码: supporting both CommonJS and AMD

(function (name, definition) {
      if (typeof module != 'undefined') {
        module.exports = definition();
      }
      else if (typeof define == 'function' && typeof define.amd == 'object') {
        define(name, [], definition);
      }
      else {
        this[name] = definition();
      }
    }('modXyz', {
          sayHi:function (name) {
            console.log('Hi ' + name + '!');
          }
        }
    ));

我想将该代码与 Curl 一起使用使我的所有代码兼容 AMD/CommonJS。我期望能够做的是:

greeter = curl(['modXyz']); 
greeter.sayHi("Gracie"); 

但是 curl 返回的对象不是我期望的对象。我能得到的最接近的是:

curl(['modXyz'], function(mod) { window.greeter = mod; }); 
greeter.sayHi("Gracie");

这似乎违背了 AMD 的初衷。 curl 有能力做这样的事情吗？我必须使用 require.js让它发生？

Answer 1

因为浏览器远离其资源，所以它必须在获取这些资源时阻塞主线程，或者必须异步获取它们。由于我们永远不应该阻塞主线程(实际上使浏览器无响应)，因此我们必须异步获取资源。 (这与任何 AMD 加载器、RequireJS、dojo 等相同)

因此，像下面这样的事情是行不通的:

var foo = require('lib/foo');

嗯，它无法在您可能习惯的浏览器中通常的全局空间中工作。不过，它可以在受控环境中工作，例如在 AMD 模块内部。

第 1 步:在模块内编写代码。

第 2 步:编写引导模块来启动您的应用。

<script src="lib/curl/src/curl.js"><script>
<script src="myapp/run.js"><script>

run.js 内部:

// curl 0.7.x requires a named module here ('myapp/run')
define('myapp/run', ['curl'], function (curl) {
    curl.config(
        baseUrl: '',
        packages: [ /* configure your 3rd-party packages */ ],
        paths: { /* configure any non-package 3rd-party libs here */ },
        preloads: [ /* put modules that *must* be loaded first here (e.g. shims) */ ],
        main: 'myapp/main'
    });
});

“myapp/main”可能看起来像这样:

define(function (require) {
    var view1 = require('myapp/view1/controller');
    view1.render();
    view1.placeAt('body');
});

在主模块(或任何 AMD 模块)内，require 的行为更像我认为您所期望的。请注意，这是一个特殊的 AMD 签名。您不能在 define 中指定依赖项并期望 require 表现得像这样。您必须仅以一种方式指定您的依赖项。这是行不通的:

define(['myapp/view1'], function (view1) {
    var foo = require('foo');
});

希望这有帮助。

-- 约翰