javascript - 使用 require.js 加载 Angular ui-bootstrap 失败，除非我重命名 ui.bootstrap？

Question

代码摘要:

主要.js:

    require.config({
        paths: {
            'uiBootstrap': '../lib/bootstrap/angular-bootstrap/ui-bootstrap-tpls.min'
        },
        shim: {***},
        priority: ['angular'],
        deps: [
            './bootstrap'
        ]
            });

---

bootstrap.js:

    define([
        'require',
        'angular',
        ...
    ], function (require, ng) {
        'use strict';
        require([
                'domReady!',
                'uiBootstrap'
                ], function (document) {
                    ng.bootstrap(document, ['app']);...

---

应用程序.js:

    define([
        'angular',
         ...
    ], function (ng) {
        'use strict';

        return ng.module('app', [
            ...
            'uiBootstrap'
        ]);
    });

我在尝试不同的组合时遇到了一系列不同的错误。直到我进入 ui-bootstrap-tpls.min.js 并将所有 ui.bootstrap 替换为 uiBootstrap 并修改模块名称引用，如上所示。很快 - ui-bootstrap 工作正常。

显然，这不是最佳解决方案。

任何人都可以提供洞察力为什么会发生这种情况以及解决它的更好方法是什么，所以我不会公开使用这个源代码修改的 ui-bootstrap 吗？

谢谢!

Answer 1

在您的 app.js 中，当将依赖项提供给 angular 时，您应该将其作为 'ui.bootstrap'(这是正确的模块名称)，而不是您在 main.js 中定义的自定义名称。

所以你的 app.js 看起来像:

define([
    'angular',
    'uiBootstrap',
     ...
], function (ng) {
    'use strict';

    return ng.module('app', [
        ...
        'ui.bootstrap'
    ]);
});