Node.js v0.12.0 で generator-angular@0.11.0 を使う
Node.js v0.12.0 がリリースされました! 新機能が盛り込まれていて大変うれしいのですが、やはり動かないものがちらほらあります。それでも、公式ホームページからダウンロードすると v0.12.0 になっているので、結構はまりそうです。旧バージョンをダウンロードするのはちょっと面倒です。
困っている一つが generator-angular です。grunt タスクを実行すると、"Warning: Cannot assign to read only property '$methodName' of false" が出ます。
$ mkdir angular1 $ cd angular1 $ yo angular ... $ grunt ... Running "ngAnnotate:dist" (ngAnnotate) task Warning: Cannot assign to read only property '$methodName' of false Use --force to continue. Aborted due to warnings. ...
原因はともかくとして、ng-annotate モジュールが Node.js v0.12.0 で動かないようです。調べてみると、ここで使われているものは ng-annotate@0.14.1 で、最新版は ng-annotate@0.15.4 です。これを最新にするために、grunt-ng-annotate を最新化します。
$ npm install --save-dev grunt-ng-annotate grunt-ng-annotate@0.9.2 node_modules/grunt-ng-annotate ├── lodash@2.4.1 └── ng-annotate@0.15.4 (tryor@0.1.2, simple-fmt@0.1.0, alter@0.2.0, simple-is@0.2.0, stringset@0.2.1, stringmap@0.2.2, stable@0.1.5, convert-source-map@0.4.1, optimist@0.6.1, source-map@0.1.43, ordered-ast-traverse@1.1.1, acorn@0.11.0) $ grunt ... Done, without errors. ...
ビンゴです!
ソースコードを追っかけて原因を探ると、Node.js 0.12 では boolen オブジェクトにプロパティを追加できなくなったっぽいです。これが原因で、古いバージョンの ng-annotate が動作しなくなったと。
$ cat hoge.js
'use strict';
false.property1 = 1;
$ nvm run v0.10.36 hoge.js
Running node v0.10.36
$ nvm run v0.12.0 hoge.js
Running node v0.12.0
/home/masakura/tmp/angular1/hoge.js:3
false.property1 = 1;
^
TypeError: Cannot assign to read only property 'property1' of false
at Object.<anonymous> (/home/masakura/tmp/angular1/hoge.js:3:17)
at Module._compile (module.js:460:26)
at Object.Module._extensions..js (module.js:478:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
at Function.Module.runMain (module.js:501:10)
at startup (node.js:129:16)
at node.js:814:3Node.js というか採用している V8 エンジンのバージョンの違いとかなんでしょうか? 結構大きな変更のような気がしますね。
調べていくうちに、ng-annotate ってなんじゃ? という疑問が... ng-annotate の READMEを読むと...
angular.module("MyMod").controller("MyCtrl", function($scope, $timeout) { });
こう書いてあるものを、
angular.module("MyMod").controller("MyCtrl", ["$scope", "$timeout", function($scope, $timeout) { }]);
こんな感じに書き換えて、AngularJS で動作するようにしてくれるものらしいです。二回書くの面倒だから一回で済ませよう! ってことらしいです。詳しくないですけど...
ということは、generator-angular はサブジェネレーターで各種コントローラーなどの生成が出来るだけでなく、generator-webapp に "bower install --save angular" しただけでではないということですね。
Yeoman は Generator ごとの差が激しくて、generator-webapp に bower install していく方を好んでいたのですが、これからは他の Yeoman Generator を使っていこうと思います。
コメントを追加