Spinejs 依赖加载顺序答案

【问题标题】：Spinejs dependency load orderSpinejs 依赖加载顺序
【发布时间】：2013-02-03 05:45:22
【问题描述】：

我正在尝试在 Spine.js 应用程序中使用 elycharts。 Elycharts 猴子补丁 jQuery 以添加 $('...').chart(...)。不幸的是，我只是收到一条错误消息，说 $ 没有函数“图表”。

因为这是我的第一个 Spine.js 应用程序，所以我使用 spin.app 生成它。这使用 jQuery 作为 NPM 模块。 Elycharts 对 CommonJS 不友好，因此必须包含在 slug.json 的“libs”部分中。根据 Spine 文档（请参阅 Hem documentation 中的 slug.json），“libs”中的任何文件都会在“依赖项”中的任何内容之前加载。所以我很确定问题是 elycharts 在 jQuery 之前加载，试图做它的猴子补丁，但由于 $ 尚未定义它会默默地失败。

有没有人看到过类似的问题，使用依赖于已经通过 NPM 包含的库的“库”？有没有办法在 libs -> 依赖项之外更精细地控制 spin.js 中的加载顺序？

【问题讨论】：

似乎更像是一个下摆问题？如果存在标签，也许添加一个标签。

标签： spine.js

【解决方案1】：

对我来说，“不太好”的解决方案是这样的：

<script type="text/javascript">
    var jQuery  = require("jqueryify");
    var exports = this;
    jQuery(function(jQuery){
// load jquery dependant libraries                  
    $.getScript("//cdnjs.cloudflare.com/ajax/libs/waypoints/1.1.6/waypoints.min.js", function() {
        var App = require("index");
        exports.app = new App({el: $("#wrapper")});      
    });
</script>

所以诀窍是在应用程序初始化之前加载 jquery 依赖库。希望它可以帮助某人。

【讨论】：

【解决方案2】：

我一直在寻找将 Twitter Bootstrap（也依赖于 jQuery）包含到 spin.js 应用程序（使用 spin 脚本生成）中的解决方案。我发现的最好的是：只需将jqueryify 替换为jquery.js！

删除这些行：

./app/lib/setup.coffee:3:require('jqueryify')
./package.json:9:    "jqueryify": "~0.0.1",
./public/index.html:9:    var jQuery  = require("jqueryify");
./slug.json:5:    "jqueryify",

然后将jquery.js和你的javascript库放入app/lib并添加到slug.json libs数组中：

"libs": [
  "app/lib/jquery.js",
  "app/lib/jquery-dependent-3rd-party-lib.js"
]

瞧！

附：至于 Twitter Bootstrap，我建议将整个 bootstrap 目录放入 public 目录（因为它还附带 CSS 和图像）并相应地从 slug.json 引用它：

"libs": [
  "app/lib/jquery.js",
  "public/bootstrap/js/bootstrap.min.js"
]

这样更新 Twitter Bootstrap 库将是微不足道的 - 无需将文件分散到各处。

【讨论】：