2015-05-03 2 views
1

Хорошо, есть куча вопросов с похожими названиями, но ни один из них не помог мне решить мою проблему, так что вот оно.Использование requireJS с угловым; Невозможно прочитать «модуль модуля» undefined

Я пытаюсь использовать Angular with RequireJS; Я получаю сообщение об ошибке Uncaught TypeError: Cannot read property 'module' of undefined, которое относится к объекту angular в пределах angular-routes.js file. Это говорит мне о том, что requireJS пытается загрузить угловые маршруты до того, как угловые загрузили. У меня создалось впечатление, что этого не произойдет, потому что я установил «угловой маршрут» как зависящий от «углового» в пределах прокладки. Может ли кто-нибудь определить, что я делаю неправильно здесь?

// Setup requireJS 

require.config({ 

    baseUrl : "scripts", 

    packages : [ 
     { "name":"angular", "location":"../bower_components/angular", "main":"angular"}, 
     { "name":"angular-route", "location":"../bower_components/angular-route", "main":"angular-route"}, 
     { "name":"angular-animate", "location":"../bower_components/angular-animate", "main":"angular-animate"}, 
     { "name":"angular-storage", "location":"../bower_components/angular-storage/dist", "main":"angular-storage"}, 
     { "name":"jquery", "location":"../bower_components/jquery/dist", "main":"jquery"} 
], 

    shim:{ 
     'angular' : { exports : 'angular', deps : ['jquery'] }, 
     'angular-route' : { deps : ['angular'] }, 
     'angular-animate' : { deps : ['angular'] }, 
     'angular-storage' : { deps : ['angular'] }, 
    } 

}); 

// Load app files 
function loadApp($, app) 
{ 
    angular.element(document).ready(function(){ 
     angular.bootstrap(document, ['mealPlannerApp']);  
    }); 
} 
requirejs(['app'], loadApp); 

app.js Мой файл выглядит следующим образом

(function() { 

    // Declare AMD module with dependencies 
    define(['angular', 'angular-route', 'routes'], 

    function(config) 
    { 

     var app = angular.module('mealPlannerApp', ['ngRoute', 'ngAnimate', 'ngAnimate']); 
     app.config(config); 
    }); 

}()); 
+0

кажется, что вы вводили тот же модуль дважды '' ngAnimate' как angular.module ('mealPlannerApp ', [' ngRoute ',' ngAnimate ',' ngAnimate ']); ' –

+0

Правда - спасибо. Это была опечатка; проблема все еще сохраняется ... –

+0

Я вижу довольно много ошибок в вашем коде (но они не объясняют вышеприведенную ошибку). Я думаю, вам нужно также требовать «углово-одушевить» – asgoth

ответ

3

Пакеты велики для внутренних пакетов, я не пытался загрузить основные AngularJS файлы в них.

Прочтите http://jonathancreamer.com/require-js-packages-for-building-large-scale-angular-applications/ для получения более подробных пояснений и примеров, чем раздел конфигурации изменений, к чему-то подобному. Основное изменение заключается в замене пакетов с пути

Просьба также рассмотреть возможность изменить переменные стиля верблюжьего

require.config({ 
    paths: { 
     angular: '../bower_components/angular/angular', 
     'angular-route': '../bower_components/angular-route/angular-route', 
     'angular-animate': '../bower_components/angular-route/angular-animate', 
     'angular-storage': '../bower_components/angular-route/angular-storage' 
    }, 

    shim: { 
     'angular' : { exports : 'angular', deps : ['jquery'] }, 
     'angular-route' : { deps : ['angular'] }, 
     'angular-animate' : { deps : ['angular'] }, 
     'angular-storage' : { deps : ['angular'] }, 
    }, 

    priority: [ 
     "angular" 
    ] 
}); 
Смежные вопросы