1

我为 Ractive.js 测试了新的 Backbone 适配器,它就像一个魅力加载它作为示例......

<script src='lib/Ractive.js'></script>
<!-- the adaptor -->
<script src='lib/adaptors/Backbone.js'></script>

现在我正在尝试使用 require.js 和 ractive.backbone 适配器在 AMD 中加载模块,因为 ractive 库尚未加载...

define(["ractive","ractive.backbone"], function(Ractive) {....});

来自 ractive.backbone.js (未捕获的 ReferenceError: Ractive is not defined )

使用 AMD 加载 Ractive 适配器的最佳实践是什么?

4

2 回答 2

3

没有一个真正的方法,因为每个 AMD 项目都是不同的(有些人将 Backbone 包装在一个define函数中,有些人使用shim配置,每个人都将事物组织到不同的文件夹结构中......)。不过,基本上,适配器需要在同时具有Ractive和的词法范围内运行Backbone

所以解决它的一种方法是创建一个简单的包装模块,如下所示:

define(["ractive","backbone"], function (Ractive, Backbone) {
  // adaptor code goes here. No need to include the outer IIFE
  // (https://github.com/Rich-Harris/Ractive/blob/master/plugins/adaptors/Backbone.js)
});

然后,您可以继续做

define(["ractive","ractive.backbone"], function(Ractive) {....});

对于同时使用 Ractive 和 Backbone 适配器的每个模块,或者您可以在应用程序启动时要求 Backbone 适配器 - 只要在 Ractive 渲染任何内容之前需要它,它就会起作用:

// in main.js, or equivalent
require(["app","ractive.backbone"], function (app) {
  app.init(); // or whatever
});

我愿意接受有关如何使整个事情更加不言自明的建议!

于 2013-10-10T08:37:51.193 回答
1

在我们的项目中,我们使用的设置与 Richard Harris 在此处描述的设置非常相似。即我们有一个包含适配器的包装器模块(ractive.wrap.js),然后使用 require.config 的 map 选项来传递包装器而不是 Ractive 本身。看起来像这样:

require.config(
{
    "map":
    {
        "*": {"ractive": "ractive.wrap"},
        "ractive.wrap": {"ractive": "ractive"}
    }
}

这样每当你使用

define (['ractive'], function(Ractive)
{
    // some cool function using ractive
});

实际上,您可以通过板载 Backbone 适配器获得 Ractive。

于 2013-11-08T09:28:47.723 回答