使用Grunt构建后获取未捕获的对象错误

时间:2014-07-05 20:01:55

标签: angularjs dependency-injection gruntjs

当我运行" grunt build"我的页面停止工作命令与我的Yeoman生成angularjs项目。我收到以下错误:

未捕获对象127.0.0.1:9000/bower_components/angular/angular.js:3857

图片来源: https://dl.dropboxusercontent.com/u/2188934/Skjermbilde%202014-07-05%20kl.%2021.49.26.png

有时我会这样做: 未捕获的对象angular.js:78 https://dl.dropboxusercontent.com/u/2188934/Skjermbilde%202014-07-05%20kl.%2022.30.46.png

app.js:

'use strict';

// This is the main js-file where the module corsaneApp is initialized.
angular
  .module('corsaneApp', [ // This is all the external angular directives we are using
    'ngCookies',
    'ngResource',
    'ngSanitize',
    'ngRoute',
    'ui.bootstrap',
    'ngAnimate',
    'summernote',
    'ui-sortable'

  ]) // This shows what html file and controller to load when a url is specified.
  .config(['$routeProvider', function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/home.html',
        controller: 'HomeCtrl'
      })

      .when('/search', {
        templateUrl : 'views/home.html',
        controller  : 'SearchCtrl'
      })

      .when('/submit', {
        templateUrl : 'views/submit.html',
        controller  : 'SubmitCtrl'
      })

      .when('/playlist', {
        templateUrl : 'views/home.html',
        controller  : 'PlaylistCtrl'
      })

      .when('/playlistbar', {
        templateUrl : 'views/playlistbar.html',
        controller  : 'PlaylistbarCtrl'
      })

      .when('/resource', {
        templateUrl : 'views/resource.html',
        controller  : 'ResourceCtrl'
      })

      .otherwise({
        redirectTo: '/'
      });

  }]);

的index.html:

<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" ng-app="corsaneApp"> <!--<![endif]-->
  <head>
    <meta charset="utf-8">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    <!-- build:css styles/vendor.css -->
    <!-- bower:css -->
    <!-- endbower -->
    <!-- endbuild -->
    <!-- build:css({.tmp,app}) styles/main.css -->
    <link rel="stylesheet" href="styles/main.css">
    <link rel="stylesheet" href="styles/bootstrap-lumen.css">
    <link rel="stylesheet" href="styles/animations.css">
    <link rel="stylesheet" href="styles/global.css">
    <link rel="stylesheet" href="styles/submit.css">
    <link rel="stylesheet" href="styles/search.css">
    <link rel="stylesheet" href="styles/playlist.css">
    <link rel="stylesheet" href="styles/sidebar.css">
    <link rel="stylesheet" href="styles/resource.css">
    <link rel="stylesheet" href="styles/home.css">
    <link rel="stylesheet" href="styles/playlistbar.css">
    <link rel="stylesheet" href="styles/resourceinfo.css">
    <link rel="stylesheet" type="text/css" href="bower_components/summernote/dist/summernote.css">

    <link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">



    <!-- endbuild -->
  </head>
  <body ng-controller="HomeCtrl" >
    <div ng-include src="'views/navbar.html'"></div>
    <!--[if lt IE 7]>
      <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
    <![endif]-->

    <!-- Add your site or application content here -->
    <div class="container">
        <div ng-view></div>        
    </div>       

    <!-- Google Analytics: change UA-XXXXX-X to be your site's ID -->
 <!--    <script>
       (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
       (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
       m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
       })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

       ga('create', 'UA-XXXXX-X');
       ga('send', 'pageview');
    </script> -->

    <!--[if lt IE 9]>
    <script src="bower_components/es5-shim/es5-shim.js"></script>
    <script src="bower_components/json3/lib/json3.min.js"></script>
    <![endif]-->

    <!-- build:js scripts/vendor.js -->
    <!-- bower:js -->
    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/affix.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/alert.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/button.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/carousel.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/collapse.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/dropdown.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/tab.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/transition.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/scrollspy.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/modal.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/tooltip.js"></script>
    <script src="bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/popover.js"></script>
    <script src="bower_components/angular-resource/angular-resource.js"></script>
    <script src="bower_components/angular-cookies/angular-cookies.js"></script>
    <script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
    <script src="bower_components/angular-animate/angular-animate.js"></script>
    <script src="bower_components/fitvids/jquery.fitvids.js"></script>
    <!-- endbower -->
    <!-- endbuild -->
    <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>

    <!-- build:js({.tmp,app}) scripts/scripts.js -->
    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/home.js"></script>
    <script src="scripts/controllers/playlist.js"></script>
    <script src="scripts/filters/reverse.js"></script>
    <script src="scripts/controllers/search.js"></script>
    <script src="scripts/controllers/submit.js"></script>
    <script src="scripts/controllers/navbar.js"></script>
    <script src="scripts/services/resource.js"></script>
    <script src="scripts/controllers/playlistbar.js"></script>
    <script src="scripts/controllers/resource.js"></script>
    <script src="scripts/services/list.js"></script>
    <script src="scripts/directives/resource.js"></script>
    <script src="scripts/controllers/playlistinfo.js"></script>
    <script src="scripts/services/global.js"></script>
    <script src="scripts/directives/sortable.js"></script>

    <!-- endbuild -->

</body>
</html>

grunt build:

  grunt.registerTask('build', [
    'clean:dist',
    'bowerInstall',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'concat',
    'ngmin',
    'copy:dist',
    'cdnify',
    'cssmin',
    'uglify',
    'rev',
    'usemin',
    'htmlmin'
  ]);

当代码缩小时,显然会出现问题。我的猜测是它与依赖注入有关,但我也非常确定我是以正确的方式做到的(就像在app.js中一样)。

1 个答案:

答案 0 :(得分:1)

好的,首先,Chrome调试器中存在一个错误(具有讽刺意味),导致错误消息无法完全显示。有关详细信息,请参阅此文章:http://www.congral.com/2014/05/29/have-you-already-encountered-the-uncaught-object-exception/

经过一番挖掘后,我发现是我的夏令营依赖导致了未捕获的对象错误。引用https://docs.angularjs.org/error/ $ injector / nomod,Angular Docs告诉我:&#34;您要么错误拼写了模块名称,要么忘记加载它&#34;。但是,这个错误并没有发生,因为我忘了加载它,而是因为它在构建过程中被Grunt删除了。发生这种情况是因为我将我的脚本加载到&#34; bower:js&#34;标签,像这样:

<!-- build:js scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/summernote/dist/summernote.js"></script>
<script src="bower_components/angular-summernote/dist/angular-summernote.min.js"></script>
<!-- endbower -->
<!-- endbuild -->

当我把它移到外面&#34; endbower&#34;时,一切正常。

<!-- build:js scripts/vendor.js -->
<!-- bower:js -->
<!-- endbower -->
<script src="bower_components/summernote/dist/summernote.js"></script>
<script src="bower_components/angular-summernote/dist/angular-summernote.min.js"></script>
<!-- endbuild -->

考虑到我实际上使用凉亭安装了夏令,我发现这有些奇怪。对此问题的进一步见解将不胜感激。

相关问题