Atomのパッケージを作ってみた

Atomで編集中のファイルの文字数をカウントする機能が欲しかったのでパッケージ開発の練習をかねて作ってみました。
https://github.com/takezoe/atom-character-count

コンテキストメニューもしくはCTRL+ALT+Cで編集中のファイルの文字数を表示できます。


Atomパッケージの作り方

まずはAtomのメニューの「Packages」→「Package Generator」→「Generate Atom Package」でパッケージの雛形を生成します。「ホームディレクトリ/github/入力したパッケージ名」に以下のようなファイル群が出力されます。パッケージの開発にはCoffeeScript、LESS、CSONを使うようです。

/keymap
  character-count.cson
/lib
  character-count-view.coffee
  character-count.coffee
/menus
  character-count.cson
/spec
  character-count-spec.coffee
  character-count-view-spec.coffee
/stylesheets
  character-count.less
.gitignore
CHANGELOG.md
LICENSE.md
package.json
README.md

とりあえずコンテキストメニューからアクションを呼び出したいだけなので不要なファイルを削除して以下のような構成にします。

/keymap
  character-count.cson
/lib
  character-count.coffee
/menus
  character-count.cson
.gitignore
CHANGELOG.md
LICENSE.md
package.json
README.md

まずはpackage.jsonのactivationEventsを編集します。

{
  "name": "character-count",
  "main": "./lib/character-count",
  "version": "0.0.0",
  "description": "A short description of your package",
  "activationEvents": ["character-count:count"],
  "repository": "https://github.com/atom/character-count",
  "license": "MIT",
  "engines": {
    "atom": ">0.50.0"
  },
  "dependencies": {
  }
}

menus/character-count.csonを編集してコンテキストメニューから呼び出せるようにします。

'context-menu':
  '.overlayer':
      'Count Characters': 'character-count:count'

ついでにkeymap/character-count.csonを編集してキーボードショートカットもつけてみます。

'.workspace':
  'ctrl-alt-c': 'character-count:count'

肝心のパッケージ本体であるlib/character-count.coffeeは以下のような感じ。前述の通りコードはCoffeeScriptで書くようです。Github社内ではCoffeeScriptが標準になっているという話ですが、そのためでしょうか。ちなみにここでは使っていませんが、何もしなくてもjQueryは使える感じでした。

module.exports =
  count: ->
    editor = atom.workspace.activePaneItem
    alert('char count: ' + editor.getText().length)

  activate: (state) ->
    atom.workspaceView.command "character-count:count", => @count()

これでパッケージを「ホームディレクトリ/.atom/packages」にまるっとコピーすると作ったパッケージを使えるようになります。

ちなみにMacだとパッケージの雛形生成時にシンボリックリンクが貼られており、コピーしなくても生成されたディレクトリの方を編集するだけで使えました。

また、パッケージのファイルを変更した場合は一度コマンドパレット(COMMAND+SHIFT+P)から「Window:Reload」(もしくはCTRL+ALT+COMMAND+L)でウィンドウをロードし直すと反映されます。

思っていたより簡単です

CoffeeScript、LESS、CSONを使って思っていたよりも簡単にパッケージを作ることができます。また、AtomではDeveloper Toolsを使うこともできるので、APIがよくわからない場合にJavaScriptでプロトタイピングができるのも便利です。既存のパッケージのソースも参考にできますし、最初の敷居はかなり低いのではないでしょうか?

Atomにこんな機能が欲しいなー」と思った場合はパッケージ作成にトライしてみるといいと思います。