Question

我正在开发一个带有backbone.js的javascript应用程序，它说，为了便于开发，我以这种方式构建我的文件

app
 |
 + views
 |    L movieRow.js
 |    L movieDetail.js
 |
 + models
 |    L movie.js
 |    L tvshow.js
 |
 + collections
 |    L movies.js
 |    L tvshows.js
 |
 + templates
 |    L movieList.tpl
 |    L movieDetail.tpl
 |    L applicationUI.tpl
 |
 L application.js

现在，这是向用户提供服务器的很多javascript文件，我看到一些关于labjs或require.js的讨论，并决定用它来测试。但我不知道如何将所有骨干模型或视图重写为这些require.js模块。

任何正确方向的帮助都会很好。

Answer 1

理解要求的关键（至少在我的小脑中）是要记住，从函数返回的内容将可用于引入（或需要）此模块的其他模块。所以在下面的代码中，我需要jquery和backbone（jquery是一个由“require-jquery”处理的特殊情况）。当这些2可用时，它将调用我的函数，该函数将返回我创建的View构造函数。

define([    
    'jquery'
    'libraries/backbone'
], function ($) {
        var MovieRow = Backbone.View.extend({
            render: function () {

                return this;
            }
        });

        return MovieRow;
});

然后你可能会在你的页面上写这样的东西。请注意，jquery是数组中第一个必需的项。这对应于我函数中的第一个参数。 View是第2名，Model是第3名。然后我可以使用上面“构造”代码中的返回值。

require({
    baseUrl: '/'
},[
    'jquery',
    'app/views/movieRow',
    'app/models/movie',
    'libraries/backbone'
], 
function ($, MovieRowView, Movie) {
    var view = new MovieRowView({model : new Movie());
    $('body').append(view.render().el);        
});

希望这有用......我们一直很喜欢Backbone并要求：）

Answer 2

我在评论中用完了空间，想要包含一些代码，所以我正在制作第二个答案：

@timDunham所发布的内容在很大程度上是相当不错的，尽管我还有一些额外的内容可能会引起人们的进一步理解。

在代码中：

define([    
    'jquery'
    'libraries/backbone'
]

我相信Underscore不见了。首先，Backbone需要Underscore才能运行，没有它我觉得它会破坏。其次，除非你使用的是Underscore和Backbone的AMDJS分支，否则它们不支持AMD。使用v1.3.0对Underscore REMOVED AMD支持。如果我们假设我们使用非AMD下划线和主干，则它们可能不属于define[]，而应该是require[]。

如果正确使用AMDJS版本，那么正确的定义将如下所示：

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

这假设我在require config中创建了路径：

require.config({
    paths : {
        jquery : 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min',
        underscore : '../../libs/js/underscore/underscore.min',
        Backbone : '../../libs/js/backbone/backbone',
    }
});

我见过一些不使用AMDJS版本的实现，因为它们不是异步模块，所以你必须确保它们以正确的顺序加载。

我相信这并不能保证加载依赖项的正确顺序：

require({
    baseUrl: '/'
},[
    'jquery',
    'app/views/movieRow',
    'app/models/movie',
    'libraries/backbone'
],

因为某些内容被列为依赖项，并不意味着它会在需要时加载。使用异步模块这不是问题，但在这个例子中我没有看到它提到，所以我们假设它们不是AMD。此模块依赖于jquery，movieRow，movie和backbone。但是如果骨干试图在jquery之前加载...（x_x）为什么世界为什么？

这就是为什么我认为require.js有一个名为order的插件！救援。有了订单！你可以设置你的依赖项，并在......井......顺序加载脚本。像这样：

require({
    baseUrl: '/'
},[
    'order!jquery',
    'app/views/movieRow',
    'app/models/movie',
    'order!libraries/underscore',  // <- Don't forget me!
    'order!libraries/backbone'
]

我相信，您的模块将评估并保证首先加载jquery，然后加载下划线，然后加载主干。虽然在这种情况下谁不关心，但不保证电影或电影？： - ）

我在我的项目中使用AMDJS-Backbone和AMDJS-Underscore forks，因此我通常将它们放在define[]中，并且它可以顺利运行。 RequireJS非常棒，并且已经清理了我的代码。我到处都是JRBurke，RequireJS的作者随处可见，他总是超级有用，他对有关require.js的所有内容都有所帮助。我的意思是一切。我的理论是他通过心灵感应连接到Require，并且无论何时在网络上发生新的requirejs实例，他都可以立即访问该知识。我敢打赌，如果这个线程讨论继续，他会在这里弹出来打个招呼。

我的免责声明是我也是要求的新手，我可能会误解事物。但据我所知，我认为这些额外的指针和信息可能会帮助人们使用require来组合更好的代码。

参考文献：

Backbone.js＆amp; require.js：如何将我的模型，视图和集合转换为require.js模块？

2 个答案: