【问题标题】：jQuery Plugin with Dependencies带有依赖项的 jQuery 插件
【发布时间】：2017-03-02 03:24:38
【问题描述】：

我正在尝试构建一个“简单”的 jQuery 插件，它依赖于其他 jQuery 插件（当然还有 jQuery 它自己）。

经过一些阅读和研究，我认为require.js 可以完成这项工作，但我无法弄清楚两个主要问题。

假设myPlugin.js 依赖于其他 2 个 jQuery 插件：

bootstrap-datetimepicker.js 和 select2.js。

虽然bootstrap-datetimepicker.js 依赖于moment.js 和bootstrap.js 并且两个插件以及myPlugin.js 都依赖于jQuery.js

第一期：

我想为使用myPlugin.js 的人简化事情。我只想为他们提供一个库并要求他们在 HTML 页面上包含 myPlugin.js。
然后，通过使用类似以下内容的方式调用插件：$('#target').myPlugin();,
myPlugin.js 将完成注入依赖项的所有必要工作以及该插件的实际工作。我无法理解的是层次结构应该如何。
我的意思是如果我要使用require.js，我需要在myPlugin.js之前将它包含在html页面中，我还需要管理依赖项加载的顺序。
例如，对于bootstrap-datetimepicker.js，我需要先加载moment.js、jquery.js 和bootstrap.js。
所以层次结构和时间是我在这里的第一期的主要挑战。

第二期：

重复和冲突怎么办？
也许想要使用myPlugin.js的人已经加载了jQuery.js和bootstrap.js。
我不想再次加载它并在他/她的页面上创建重复和冲突。

【问题讨论】：

标签： javascript jquery jquery-plugins requirejs dependencies

【解决方案1】：

您的插件应该使用UMD pattern 以适合其执行环境的方式获取它的依赖关系。您只需要更新 AMD 案例的分支以列出所有依赖项并让 RequireJS 加载它们。

您分发的内容应仅包含您的插件，并且您的代码不应尝试加载依赖项。否则，我可以根据经验告诉你，使用 AMD 加载程序的人（仅举出 one 组）会诅咒你的名字。我不是在开玩笑，当您开始通过 AMD 加载器及其外部加载脚本时，会产生很多难以解决的问题。记录您的插件期望可用的内容，并让插件的用户设置他们的环境以提供必要的模块。

如果您认为包含依赖项的构建对您的插件的某些用户有用，那么创建一个包含几乎所有内容的附加构建。（在我看来，至少 jQuery 也不应该出现在这个版本中。）

【讨论】：