土日で艦これイベント海域E-4をなんとか突破したぽちです，おはようございます．

今日は島風轟沈の日らしいですね．

ktty1220 さんのBackbone.jsで全イベントをconsoleに出力するデバッグ用スクリプト

が便利だったので使ってたのですが， 毎回backbone.debug.jsをプロジェクトにコピーして回るのが大変だったので bowerでサクッとインストール出来るようにしてみました．

backbone-event-logger

使い方

1

$ bower install backbone-event-logger

でインストールされます．

あとは

1
2

<script src="/bower_components/backbone/backbone-min.js"></script>
<script src="/bower_components/backbone-event-logger/backbone-event-logger.min.js"></script>

みたいに読みこめば，ガンガンログが出ます．

オリジナルとの違い

オリジナルと変更した部分としては

• Backbone[<ModelとかRouterとか>]::initializeで自動的にログ出力を有効化
• デフォルトで@constructor.nameをログに出すようにした
• coffee化
• 名前を.debugから.event-loggerへ（デバッグっていうよりロガーだなと思ったので）
• AMD/RequireJSでも読み込めるようにしてみた（けど試してない）

こんな感じで出ます

1

23:04:42 Model:ContentModel  remove [> [ContentModel, Contents, Object]

ContentModel って書いてる部分が@constructor.nameで出してるところ．

イマイチなところ

オリジナルにあったスタイルの変更等はbower installした後に bower_components内を変更しないといけなくて，悩んでいるところ． （自動適用にしたので外部から設定する口を用意してもイマイチかなと）

ところでbower installした時ってbackbone-event-logger.min.jsやbackbone-event-logger.js 以外のファイルは配置されるべきなんだろうか？ルールがわからない． （backbone.jsのbowerも配置されてた）

まとめ

• 便利なBackbone.jsで全イベントをconsoleに出力するデバッグ用スクリプト をモジュール化した
• 自動読み込みや名前の表示などオリジナル版をちょっとカスタムしてる
• PR/forkどうぞ backbone-event-logger