Subscribed unsubscribe Subscribe Subscribe

running "wiredep:app" (wiredep) task Warning Cannot read property 'main' of undefined Use --force to continue Aborted due to warnings

先日、$ bower install angular-ui-bootstrap-bower --saveを実行した後に
bower-components下のangular-ui-bootstrap-bowerディレクトリを削除して、
$ grunt serveすると

running "wiredep:app" (wiredep) task  
Warning Cannot read property 'main' of undefined Use --force to continue  
Aborted due to warnings  

とのエラーでAngularアプリが起動しなくなってしまいました。

結果として、$bower installコマンドを実行したら直りました。
bower.jsonにはdependenciesにはあっても、実際のディレクトリに存在しない場合にこのエラーが発生したと思われます。

解決策としては、
1.bower.jsonのdependecies下には実在するbower-components下のもののみ記載する。
2.bower installで必要なbower-componentsをインストールする
のどちらかだと考えます。
そもそも、grunt wiredepとは何なのか知らなかったので、調べてみます。

grunt wiredep

    // Automatically inject Bower components into the app
    wiredep: {
      options: {
        cwd: '<%= yeoman.app %>'
      },
      app: {
        src: ['<%= yeoman.app %>/index.html'],
        ignorePath:  /\.\.\//
      },
      sass: {
        src: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'],
        ignorePath: /(\.\.\/){1,2}bower_components\//
      }
    }

なるほど、自動的にbower-componentsをアプリケーションに入れてくれるのですね。
本家サイトでは

$ bower install jquery --save
$ grunt wiredep  

でGruntfile.jsのwiredepのsrcに指定したファイルに

<!-- bower:js -->
<script src="bower_components/jquery/jquery.js"></script>
<!-- endbower -->

を入れ込んでくれると書いてありますね

今回であれば、index.htmlにbower.jsonに記載されている、
dependenciesのbower-components下で読み込む必要があるjsのスクリプトタグを書き込んでくれるですね。

つまり、bower.jsonに記載があるが、
bower-componentsにない場合はエラーになるのか。
grunt wiredepの実行内容を知っていれば当然でした。。。