RequireJS 的冗余依赖

Question

我的问题是有冗余的 RequireJS 依赖项指向同一个 JS 库。

引用的库是jQueryUI，它被内部和外部库引用Gridstack，这是导致这个问题的原因。

内部和外部引用都应指向一个文件 jquery-ui.js。

如何配置 RequireJS（即在 main.js 中）以在不对任何现有的任何内容进行任何更改的情况下将这些引用作为一个整体处理？modules/libraries?

JQuery UI v1.11.2 - 我的JQueryUI分布（单个文件）
Gridstack 0.2.5-dev - 将其引用为 jquery-ui/core、jquery-ui/widget、jquery-ui/mouse、jquery-ui/draggable 和 [=16= 的库]
我内部使用jquery.ui

Answer 1

查看您尝试加载的 jquery-ui.js 文件，我发现它是多个函数的组合，这些函数可能位于单独的文件和中只调用 define 一次。因此它注册为单个模块。知道这一点很重要，因为如果它为 jquery-ui/mouse、jquery-ui/draggable 等中的每一个都调用了 define，那么解决方案就会不同，因为那时我们将讨论单个 jQuery UI 包含多个模块的文件。

好的，既然已经建立了，您可以做的就是在 RequireJS 配置中使用 map。我假设您已经有适当的 paths 配置，允许将 jquery-ui.js 文件作为 jquery.ui 模块加载。添加此地图：

map: {
    '*': {
        'jquery-ui/mouse': 'jquery.ui',
        'jquery-ui/draggable': 'jquery.ui',
        // And so on for all different cases...
    }
}

这表示在所有模块 (*) 中，每当请求 jquery-ui/mouse 时，然后加载 jquery.ui，以此类推将在 [= 下列出的所有其他模块20=].

Answer 2

虽然 Louis 的回答为我指明了正确的方向，但我仍然花了一些时间来找出完整的解决方案，所以我在这里发布我的工作 requirejs 配置以供将来参考：

requirejs.config( {

    baseUrl: 'js',
    paths: {
        jquery: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min',

        'jquery.ui': 'https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min',

        lodash: 'https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min',
        gridstack: 'https://cdnjs.cloudflare.com/ajax/libs/gridstack.js/0.3.0/gridstack.min',
        'gridstack.jqueryui': 'https://cdnjs.cloudflare.com/ajax/libs/gridstack.js/0.3.0/gridstack.jQueryUI.min',

    },
    map: {
        '*': {
            'jquery-ui/data': 'jquery.ui',
            'jquery-ui/disable-selection': 'jquery.ui',
            'jquery-ui/focusable': 'jquery.ui',
            'jquery-ui/form': 'jquery.ui',
            'jquery-ui/ie': 'jquery.ui',
            'jquery-ui/keycode': 'jquery.ui',
            'jquery-ui/labels': 'jquery.ui',
            'jquery-ui/jquery-1-7': 'jquery.ui',
            'jquery-ui/plugin': 'jquery.ui',
            'jquery-ui/safe-active-element': 'jquery.ui',
            'jquery-ui/safe-blur': 'jquery.ui',
            'jquery-ui/scroll-parent': 'jquery.ui',
            'jquery-ui/tabbable': 'jquery.ui',
            'jquery-ui/unique-id': 'jquery.ui',
            'jquery-ui/version': 'jquery.ui',
            'jquery-ui/widget': 'jquery.ui',
            'jquery-ui/widgets/mouse': 'jquery.ui',
            'jquery-ui/widgets/draggable': 'jquery.ui',
            'jquery-ui/widgets/droppable': 'jquery.ui',
            'jquery-ui/widgets/resizable': 'jquery.ui',
        }
    },
} );

require( ['dashhub'] );

请注意，我似乎无法使用来自 cdnjs 的 gridstack.all.js 脚本。这意味着在您的模块中，您必须在 define 命令中同时引用 gridstack 和 gridstack.jqueryui。

RequireJS 的冗余依赖

Redundant dependencies with RequireJS

javascript

jquery

jquery-ui

shared-libraries

requirejs