秀丸でJavaScriptのアウトライン解析する定義ファイル

私はエディタとして秀丸を愛用しています。秀丸 Version 6.0 からはアウトラインのツリー表示機能がついていて、かなり便利です。

prototype.js を利用した JavaScript がきれいに解析される定義ファイルを作ったので公開します。Class.create とか Object.extend を使ったクラス定義を正しく解析してくれます。ためしに prototype.js 自身を解析するとこんな具合。

左側にツリーでアウトラインが出てますね。

私はキー割り当てで [アウトライン解析の枠切り替え] に Alt-X キーを割り当てています。Alt-X を押してアウトラインにフォーカスして、カーソルキーや PageUp/Down で関数を選んで、Enter を押す、という手順によって比較的大きなソースでも移動が楽々です。

定義ファイル:

/<TreeWord>
/0000,0002,0000,00000000,00010153,"^(var +)?[\\$\\.a-zA-Z0-9_]+ *= *Class\\.create","Class"
/0000,0002,0000,00000000,00012513,"^(var +)?([\\$\\.a-z_0-9A-Z]+) *= *","Object"
/0000,0002,0000,00000000,00012153,"[\\$a-zA-Z_0-9]+\\.prototype *= *","prototype"
/0000,0002,0000,00000000,00012113,"^Object\\.extend","override"
/0000,0002,0000,00000000,00012111,"^/\\*","comment"
/0000,0002,0000,00000000,00012553,"function +[a-zA-Z0-9_]+ *\\([^\\)]*\\)","function"
/0001,0002,0000,00000000,00010553,"^[ \\t]*[\\$a-zA-Z0-9_]+ *: *function *\\([^\\)]*\\)","Method"
/0001,0002,0000,00000000,00012513,"^[ \\t]*[\\$a-zA-Z0-9_]+ *:","Field"

設定方法:

  1. ファイルタイプ別の設定で、JavaScript に関連付けた設定を開く
  2. [アウトライン]->[解析] を選択
  3. [アウトライン解析の方法] として [ツリー表示 - 通常]を選択
  4. [読み込み] ボタンを押して、上のデータをファイルから読み取る
  5. [レベルの見せ方] を [相対的] にする