使用填充程序按顺序加载js文件

Question

在阅读完文档并尝试了一些内容后，我不确定为什么下面的代码没有按顺序加载脚本：

require.config({
baseUrl: '../js/',
shim: {
   jQuery       : 'vendor/jquery-1.11.0.min',
   chosen       : 'plugins/chosen.jquery',
   swiper       : 'plugins/idangerous.swiper',
   sidr         : 'plugins/query.sidr.min',
   animations   : 'animations',
   forms        : 'forms',
   partials     : 'partials',
   scripts      : 'scripts'
},
urlArgs: "bust=" + (new Date()).getTime()
});


require(['vendor/jquery-1.11.0.min','plugins/chosen.jquery','plugins/idangerous.swiper','plugins/jquery.sidr.min', 'animations', 'forms', 'partials', 'scripts'], function( $, chosen, swiper, sidr, animations, forms, partials, scripts ) {
    console.log( $, animations, forms, partials, scripts );
});

基本上我想在jquery之后但在所有其他脚本之前加载插件文件夹中的文件。

Answer 1

您似乎将paths与shim混为一谈。使用paths定义模块名称并将其映射到特定文件。此外，一旦您定义了名称，那么您必须在任何地方使用此名称​​引用此模块。否则，RequireJS会认为您指的是另一个模块。例如，如果"foo"映射到"scripts/foo"并执行类似request(["foo", "scripts/foo", ...的操作，则对于RequireJS "foo"和"scripts/foo"不是同一个模块。

jQuery模块的名称必须是"jquery"，所有下限，或者你会在某些时候遇到麻烦。

如果您指定了所有内容并且我理解正确，则以下内容应该按照您的目标进行。 exports字段包含???，因为我无法知道您需要在哪里导出。 3个插件没有exports字段，因为我认为它们是jQuery插件，严格来说并不是必须给它们一个。但是，最好给它们一个exports值来帮助RequireJS确保在旧的IE浏览器中加载所有内容。

此外，我已经从你的问题中得到了你所拥有的东西。如果这里的某些模块是由您创建的，那么他们应该使用define并将其依赖项列为define调用的第一个参数，而不是使用填充程序。或者，如果这些模块中的某些模块是调用define的第三方模块，则同样适用。

require.config({
    baseUrl: '../js/',
    paths: {
        jquery       : 'vendor/jquery-1.11.0.min',
        chosen       : 'plugins/chosen.jquery',
        swiper       : 'plugins/idangerous.swiper',
        sidr         : 'plugins/query.sidr.min',
    },
    shim: {
        chosen: ['jquery'],
        swiper: ['jquery'],
        sidr: ['jquery'],
        animations: {
            deps: ['chosen', 'swiper', 'sidr'],
            exports: ???,
        },
        forms: {
            deps: ['chosen', 'swiper', 'sidr'],
            exports: ???,
        },
        partials: {
            deps: ['chosen', 'swiper', 'sidr'],
            exports: ???,
        },
        scripts: {
            deps: ['chosen', 'swiper', 'sidr'],
            exports: ???,
        },
    },
    urlArgs: "bust=" + (new Date()).getTime()
});


require(['jquery','chosen','swiper','sidr', 'animations', 'forms', 'partials', 'scripts'], function( $, chosen, swiper, sidr, animations, forms, partials, scripts ) {
    console.log( $, animations, forms, partials, scripts );
});