非 AMD js 文件的 requireJS 顺序执行答案

【问题标题】：requireJS sequential execution for non-AMD js files非 AMD js 文件的 requireJS 顺序执行
【发布时间】：2013-07-30 02:32:24
【问题描述】：

我正在尝试使用 requirejs 捆绑我的 javascript 并在其之上构建。已经为 UI 操作和库使用开发了一些现有的 js 文件。

这些 js 文件需要在 jquery 包含之后立即包含，它还为网站中的社交媒体小部件执行操作。任何人，我写了下面的代码来尝试捆绑它们以在加载站点时执行，由于某种原因，我可以看到它们在 firebug 网络中加载。但是里面的代码失败了，因为它执行了不止一次..

以下是我的配置和要求声明，任何人都可以就为什么会发生这种行为提出建议？

'use strict';

require.config({
    paths: {
        jquery: '../vendors/jquery/jquery-1.10.2.min',
        underscore: '../vendors/underscore/underscore-min-1.5.1',
        backbone_query: '../vendors/backbone-query-parameters/backbone.queryparams',
        backbone: '../vendors/backbone/backbone-min-1.0.0',
        theme: '../vendors/theme/v1.9/scripts/'
    },
    shim: {
        'jquery': {
            exports: '$'
        },
        'underscore': {
            exports: '_'
        },
        'backbone': {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
        },
        'theme/base': {
            deps: ['jquery']
        },
        'theme/message': {
            deps: ['jquery', 'theme/base']
        },
        'theme/input_counter': {
            deps: ['jquery', 'theme/base', 'theme/message']
        },
        'theme/placeholder': {
            deps: ['jquery', 'theme/base', 'theme/message', 'theme/input_counter']
        },
        'theme/scrollbar': {
            deps: ['jquery', 'theme/base', 'theme/message', 'theme/input_counter', 'theme/placeholder']
        },
        'theme/fields': {
            deps: ['jquery', 'theme/base', 'theme/message', 'theme/input_counter', 'theme/placeholder', 'theme/scrollbar']
        },
        'theme/validate': {
            deps: ['jquery', 'theme/base', 'theme/message', 'theme/input_counter', 'theme/placeholder', 'theme/scrollbar', 'theme/fields']
        },
        'theme/main': {
            deps: ['jquery', 'theme/base', 'theme/message', 'theme/input_counter', 'theme/placeholder', 'theme/scrollbar', 'theme/fields', 'theme/validate']
        }
    }
});


require(['jquery', 'theme/base', 'theme/message', 'theme/input_counter',
    'theme/placeholder', 'theme/scrollbar', 'theme/fields', 'theme/validate', 'theme/main']);

【问题讨论】：

标签： requirejs

【解决方案1】：

我在这里注意到了两件事：

你的 require() 函数是空的，require() 回调函数应该初始化诸如 Backbone View 之类的东西。
在 shim 中，您尝试管理所有依赖项，仅声明 Backbone 和 _ 的依赖项。

你的 requirejs 引导文件（你的配置文件）应该是这样的，考虑到 main.js 作为你的 js 文件，它初始化你的主骨干视图：

requirejs.config({
    paths: {
        jquery: '../vendors/jquery/jquery-1.10.2.min',
        underscore: '../vendors/underscore/underscore-min-1.5.1',
        backbone_query: '../vendors/backbone-query-parameters/backbone.queryparams',
        backbone: '../vendors/backbone/backbone-min-1.0.0'
    },
    shim: {
        'backbone': {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
        },
        'underscore': {
            deps: ['jquery'],
            exports: '_'
        }
    }
});

require(['theme/main']
function(main){
  main.initalize();
});

然后在define()函数内的相应js文件中告诉requirejs相应地加载你的其他文件。

【讨论】：