如何一起使用 ng-polymer-elements 、 angularjs 和 requirejs？

Question

我正在尝试将 ng-polymer-elements 与 angular 和 requirejs 一起使用。我确实遵循了这个指示https://github.com/GabiAxel/ng-polymer-elements，但我没有成功。当我从“main.js”的要求中删除实例“ng-polymer-elements”时，一切正常。有人可以帮助我吗？谢谢。

一个小问题部分：

未捕获的错误：[$injector:modulerr] 无法实例化模块 Coderup，原因如下： 错误：[$injector:nomod] 模块“Coderup”不可用！您要么拼错了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

main.js

    require.config({
        paths: {
             angular: '../bower_components/angular/angular',
            'angular-animate': '../bower_components/angular-animate/angular-animate',
            'angular-cookies': '../bower_components/angular-cookies/angular-cookies',
            'angular-mocks': '../bower_components/angular-mocks/angular-mocks',
            'angular-resource': '../bower_components/angular-resource/angular-resource',
            'angular-sanitize': '../bower_components/angular-sanitize/angular-sanitize',
            'angular-scenario': '../bower_components/angular-scenario/angular-scenario',
            'angular-touch': '../bower_components/angular-touch/angular-touch',
             bootstrap: '../bower_components/bootstrap/dist/js/bootstrap',
            'ng-polymer-elements' : '../bower_components/ng-polymer-elements/ng-polymer-elements.min',
             platform : '../bower_components/platform/platform',
            'uiRouter' : '../bower_components/angular-ui-router/release/angular-ui-router',
            jquery : '../bower_components/jquery/dist/jquery.min'
        },
        shim: {
            angular: {
                deps: ['platform'],
                exports: 'angular'
            },
            platform : {
                exports : 'platform'
            },
            jquery : {
                exports: 'jquery'
            },
            'ng-polymer-elements' : [
                'angular'
            ],
            'uiRouter': [
                'angular'
            ],
            'angular-cookies': [
                'angular'
            ],
            'angular-sanitize': [
                'angular'
            ],
            'angular-resource': [
                'angular'
            ],
            'angular-animate': [
                'angular'
            ],
            'angular-touch': [
                'angular'
            ],
            'angular-mocks': {
                deps: [
                    'angular'
                ],
                exports: 'angular.mock'
            }
        },
        priority: [
            'angular'
        ],
        packages: [

        ]
    });

    window.name = 'NG_DEFER_BOOTSTRAP!';

    require([
        'angular',
        'app',
        'uiRouter',
        'ng-polymer-elements',
        'controllers/config',
        'directives/config'
    ], function(angular,app) {
        'use strict';

        /* jshint ignore:start */
        var $html = angular.element(document.getElementsByTagName('html')[0]);
        /* jshint ignore:end */

        angular.element().ready(function() {
            angular.bootstrap(document, [app.name]);
        });
    });

app.js

    define(['angular', 'uiRouter' ,'ng-polymer-elements'], function (angular) {
        'use strict';

        var app = angular.module('Coderup', ['ui.router','ng-polymer-elements', 'appControllers', 'appDirectives'])
            .config(function ($stateProvider, $urlRouterProvider) {

                var dirView = "../views/";
                $urlRouterProvider.otherwise("/learn");

                $stateProvider
                    .state('learn', {
                        url: "",
                        controller: 'DadController'
                    })
                    .state('route1', {
                        url: "/route1",
                        views: {
                            "container": {
                                templateUrl: dirView + "teste.html"
                            }
                        }
                    });
            });
        return app
    });

问题：

Uncaught Error: [$injector:modulerr] Failed to instantiate module Coderup due to:
Error: [$injector:nomod] Module 'Coderup' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.0/$injector/nomod?p0=Coderup
    at http://localhost:9000/bower_components/angular/angular.js:80:12
    at http://localhost:9000/bower_components/angular/angular.js:1797:17
    at ensure (http://localhost:9000/bower_components/angular/angular.js:1721:38)
    at module (http://localhost:9000/bower_components/angular/angular.js:1795:14)
    at http://localhost:9000/bower_components/angular/angular.js:4064:22
    at forEach (http://localhost:9000/bower_components/angular/angular.js:335:20)
    at loadModules (http://localhost:9000/bower_components/angular/angular.js:4048:5)
    at createInjector (http://localhost:9000/bower_components/angular/angular.js:3974:11)
    at doBootstrap (http://localhost:9000/bower_components/angular/angular.js:1484:20)
    at Object.bootstrap (http://localhost:9000/bower_components/angular/angular.js:1505:12)
http://errors.angularjs.org/1.3.0/$injector/modulerr?p0=Coderup&p1=Error%3A…F%2Flocalhost%3A9000%2Fbower_components%2Fangular%2Fangular.js%3A1505%3A12) 

请大家帮我解决一下。你可以通过 git 获取这个项目。

 git clone https://vcrzy@bitbucket.org/vcrzy/coderup.git
 npm install
 run mongod
 cd /app
 node app.js
 go http://localhost:9000

Answer 1

您可能对文件加载顺序有疑问。您需要填充您的应用程序以及所有依赖项，将这些内容添加到 shim 部分：

app: [
  'angular',
  'ng-polymer-elements',
  ...
  // list all other deps
]

解决此问题的最佳方法是查看“网络”选项卡并查看文件的加载顺序，并确保它们以正确的顺序加载。