読者です 読者をやめる 読者になる 読者になる

grunt-wiredep使用の環境でangular-i18nをbowerでインストールしたら注入できないとメッセージ

AngularJSリファレンス購入して読了。これは良い本。

で、フィルタのi18nの項をみて、早速いれてみたら、grunt-wiredepを使っているGruntのタスクで注入出来ないとメッセージが出て、htmlファイルのコメントの間にi18nへのscriptタグが挿入されない。

ちなみにgenerator-angularで作ったプロジェクトで、bowerでi18nを入れての話。

% bower install angular-i18n --save

% grunt serve

# .......略...............

Running "wiredep:app" (wiredep) task
app/index.html modified.

angular-i18n was not injected in your file.
Please go take a look in "/home/vagrant/myApp/client/bower_components/angular-i18n" for the file you need, then manually include it in your file.

Running "wiredep:sass" (wiredep) task

angular-i18n was not injected in your file.
Please go take a look in "/home/vagrant/myApp/client/bower_components/angular-i18n" for the file you need, then manually include it in your file.

index.html

  <!-- bower:js -->
  <!-- 略 -->
  <script src="bower_components/angular-i18n/angular-locale_ja-jp.js"></script>
  <!-- ↑これが入って欲しいが入らない -->
  <!-- endbower -->

angular-i18nのbower.jsonを確認するとmainが指定されていない。 まあ色々な言語のパッケージが入ってるし、勝手にロケールを解決してくれるとも思えないので、そりゃそうか。 なので、bower.jsonにこうした。

//bower.json
  "overrides": {
    "angular-i18n": {
      "main": "angular-locale_ja-jp.js"
    }
  }

これでgrunt serveなりwiredepのタスクが含まれたタスクを実行すると…OK.注入された。

index.html

  <!-- bower:js -->
  <!-- 略 -->  
  <script src="bower_components/angular-i18n/angular-locale_ja-jp.js"></script>
  <!-- endbower -->