如何在我自己的脚本中包含 javascript 库 [重复]答案

【问题标题】：how to include javascript libraries in my own script [duplicate]如何在我自己的脚本中包含 javascript 库 [重复]
【发布时间】：2013-05-06 14:38:56
【问题描述】：

我已经用 javascript 编写了一些函数，并将它们放在一个单独的 JS 文件 (visualisations.js) 中。我编写的函数使用了其他几个 javascript 库，目前这些库都包含在我的 HTML 页面中，所以我有 7 行这样的

<script src="JS/jquery-1.9.1.min.js"></script>
<script src="JS/raphael.2.1.0.min.js"></script>
<script src="JS/justgage.1.0.1.min.js"></script>
<script src="JS/jquery-ui.js"></script>
<script src="JS/jquery.ui.touch-punch.min.js"></script>
<script src="JS/dygraph-combined.js"></script>
<script src="JS/visualisations.js"></script>.

我的问题：有没有办法将库包含到我自己的 JS 文件（visualisations.js）中，所以最终我只需要在 HTML 文件中包含我自己的 JS 文件，而不是写 7 行来包含所有库。

有什么建议吗？请保持您的答案易于理解，我不是高级程序员。

Grtz Stijn

【问题讨论】：

有一些库可以帮助解决此类问题，例如 requirejs。您也可以进行图书馆分组（将所有内容粘贴在一起）......老实说，我不会担心。除非您有充分的理由需要“非常优化”的页面。
@Bosworth99 我不关心优化，但为了方便起见，我正在编写的库将被其他人使用，而我正在为之做的人希望拥有它，所以你只需要输入 1 行，其中包含他们需要的所有内容。
@StijnDeSchutter 那么您还必须考虑到许多网站已经使用 jQuery 的事实。如果他们包含您的脚本并且他们的网站已经包含 jQuery 和 jQuery UI，那么如果您再次加载它，这可能会对网站的加载时间产生很大影响。
@KevinB 是的，你是对的，这个想法真该死，我正在为之做这件事的公司将不得不在我做的时候接受它。如果他们已经使用了 jquery，那么他们就不需要再包含它，或者如果他们不需要矢量图形，那么可以删除 raphael 库的行。

标签： javascript jquery html raphael justgage

【解决方案1】：

周围有很多工具，尽管它们对于你必须做的事情似乎有点过头了。

我认为最好的办法是获取这些文件并将它们复制粘贴到一个文件中。

如果你想使用一个工具，因为你需要它（以及它的复杂性：D），那么我建议你试试grunt，它很容易设置，如果你需要扩展它以适应进一步需要它几乎是无忧无虑的，例如，连接：

grunt.initConfig({
  concat: {
    dist: {
      src: ['libs/first.js', 'libs/second.js'],
      dest: 'out/first-and-second.js'
    }
  }
});

【讨论】：

【解决方案2】：

有多种工具可以满足您的需求：

http://requirejs.org/

https://developers.google.com/closure/compiler/

【讨论】：

这将被视为仅链接的答案，可能更适合作为评论。您可以通过解释您链接到的每个工具如何解决此问题来改进它。

【解决方案3】：

为每个js写一个函数，下一行：

document.write('<script type="text/javascript" src="JS/jquery-1.9.1.min.js"></script>');

【讨论】：