Question

我是需要js的初学者，我在这里有疑问。

我的文件结构如下：

root
|____assets
|____bootstrap-3.0.1
|________dist
|____________js
|____________bootstrap.min.js
|________js
|________angulajs.min.js
|________app.js
|________jquery.min.js
|________underscorejs-min.js
|____________app
|________________main.js

我的app.js文件如下所示：

requirejs.config({
    "baseUrl": "assets/js",
    "paths": {
        ": "app",
        "jquery": "jquery.min",
        "jquery-migrate": "jquery-migrate.min",
        "twitter-bootstrap": "../bootstrap-3.1.0/dist/js/bootstrap.min",
        "underscore": "underscore-min"
    },
    "shim": {
        "twitter-bootstrap": {
            deps: [ "jquery" ]
        }
    }
});

requirejs(["app/main"]);

我的main.js如下：

define([ "jquery", "twitter-bootstrap" ], function($) {
    $(function() {
        $("#teste").tooltip();
    });
});

我的问题是关于bootstrap情况下的主文件和依赖关系jquery。如果我声明Bootstrap依赖于jQuery我仍然必须在define函数中包含“jquery”？我试图删除“jquery”声明，但没有注入依赖项，我收到 undefined 错误。

感谢您的帮助！

Answer 1

这样做真的是要走的路：

define([ "jquery", "twitter-bootstrap" ], function($) {
    $(function() {
        $("#teste").tooltip();
    });
});

在上面的代码中，很明显$应绑定到jquery模块。如果你这样做：

define(["twitter-bootstrap" ], function($) {
    $(function() {
        $("#teste").tooltip();
    });
});

您将$绑定到twitter-bootstrap模块。如果没有进一步配置，这将无效，因为twitter-bootstrap不会导出任何内容。（它将自己安装为jQuery插件。）您可以通过设置这样的垫片来解决它：

"shim": {
     "twitter-bootstrap": {
         deps: [ "jquery" ],
         exports: '$.fn.tooltip',
         init: function ($) { return $; }
     }
 }

但是，我不建议这样做，因为有人在不知道上下文（即不知道jquery和twitter-bootstrap模块之间的关系）的情况下遇到代码的人不会轻易知道发生了什么事。

在上面的垫片中，exports字段不是绝对必要的，但它有助于RequireJS知道何时加载了Bootstrap。它应该是一个不存在之前到加载Bootstrap的符号，但在加载之后存在。

需要js初学者 - 依赖注入

1 个答案: