Dartをいろんなエディタ(IDE)で書く

これは[Dart Advent Calendar](http://qiita.com/advent-calendar/2014/dart)16日目の記事となります。

##はじめに

Dartをこれから書こうかな、と考えている人が、最初に選ぶのがエディタ OR IDEだと思います。Dartには公式で配布されているDartEditorというものがありますが、このDartEditorはちょっと使いづらかったり、重かったりと使いたくないと思う方も多いかもしれません。
  また、

* 普段使い慣れたエディターで書きたい!
* ○○以外ではコードを書きたくない!

という方もいるでしょう。ということでDartが書きやすいであろう各種エディタのプラグインを紹介します。

##WebStorm
WebStormには快適にDartで開発できる環境が整っています。WebStormに関してにはらこ氏が書いてくださった「[WebStormでDart開発](http://qiita.com/laco0416/items/ec061269eeb121768b71)」がこれ以上ないぐらいにわかりやすいので、そちらを見ていただけるとより理解が深まるとおもいます。(なんか投げてるみたいですみません...)

##Vim

Dartには、公式で公開されているvim用のプラグインがあります。
[dart-lang/dart-vim-plugin - GitHub](https://github.com/dart-lang/dart-vim-plugin)

###インストール

もしNeoBundleを導入しているのであれば、.vimrcにこれを追記するだけです。

```vim
NeoBundle 'dart-lang/dart-vim-plugin'
```

これを保存した後、``NeoBundleInstall``を実行すればインストールできます。

###イメージ

![044.png](https://qiita-image-store.s3.amazonaws.com/0/34961/b8734df2-11c6-5d58-a41f-d002d9a878b4.png)

また、quickrunを設定してdartのファイルが簡単に実行できるようにしたりするのもよいでしょう。

他にも[vim-dartanalyzer](https://github.com/miyakogi/vim-dartanalyzer)というものもあります。リアルタイムでの解析が可能なので、かなり開発が捗ります。

##Sublime Text
人気のエディター、Sublime TextにもDart公式のプラグインがあります。

[guillermooo/dart-sublime-bundle - GitHub](https://github.com/guillermooo/dart-sublime-bundle)

###インストール

1: Sublime TextにPackage Controlをインストール

Sublime TextにPackageをインストールするには、Package Controlをインストールする必要があります。

[Sublime Text 3のPackage Controlがインストールしやすくなっていた - ばくのエンジニア日誌](http://bakunyo.hatenablog.com/entry/2013/09/03/Sublime_Text_3%E3%81%AEPackage_Control%E3%81%8C%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%97%E3%82%84%E3%81%99%E3%81%8F%E3%81%AA%E3%81%A3%E3%81%A6%E3%81%84%E3%81%9F)

こちらのページを参考にしてください。

2: dart-sublime-bundleをインストール

Package ControlをSublime Textにインストールした後、`Ctrl+Shift+p`を押してCommand Paletteを開きます。

ここで`install`と打ち込むと、予測で`Package Control:Install Package`が出てきますので選択します。

その後出てきたダイアログに先ほどと同じように`dart`と打ち込み、Dartパッケージが選択されているのを確認して選択します。

インストールが完了するとこのような画面が開きます。

![053.png](https://qiita-image-store.s3.amazonaws.com/0/34961/87e68970-b900-6d2f-d082-8ed6b5bbacd8.png)

3: 設定
dart-sublime-bundleを使用するには、Dartの実行ファイルの場所を設定する必要があります。

1. 上のメニューから *Preferences → Package Settings → Dart → Settings – User*を選びます.
2. 設定ファイルを記述します

```
{
  "dart_sdk_path":"/path/to/dart-sdk"
}
```


ここで、記述するのはbinディレクトリへのパスではなく**dart-sdk**へのパスであるということに注意してください。

このプラグインを使用すれば、dartanalyzerやコードのフォーマットを使用したりと様々なことが出来ます。

もっと詳しく知りたい!という方は本家GitHubの[wiki](https://github.com/guillermooo/dart-sublime-bundle/wiki)がよくまとまっていると思います。

![054.png](https://qiita-image-store.s3.amazonaws.com/0/34961/d277df85-16d3-a60a-6736-9b4e221dc6da.png)

また、Sublime Textには自動ビルド機能があるので、そこに割り当てることでpub getの自動化なども行うことができます.

##Emacs

Emacsも言わずと知れた有名なエディターの一つですね。Emacsも公式が提供しているモードがあります。
[nex3/dart-mode](https://github.com/nex3/dart-mode)

###インストール
1. dart-mode.elをload-pathの通っているディレクトリに追加します。
2. dart-modeを反映するためにinit.elに次のように追記します。

```el
(add-to-list 'auto-mode-alist '("\\.dart\\'" . dart-mode)) 
(autoload 'dart-mode "dart-mode" "Major mode for editing Dart files" t)
```
###イメージ
![055.png](https://qiita-image-store.s3.amazonaws.com/0/34961/29162851-d369-bf57-c231-e697aa09513a.png)

##Atom

GitHub社製の新エディタ、AtomにもDart用Packageがあります。

[radicaled/dart-tools](https://github.com/radicaled/dart-tools)
[Daegalus/atom-language-dart](https://github.com/Daegalus/atom-language-dart)

dart-toolsはpub getコマンドや、コードのフォーマットなどを行ってくれます。language-dartはシンタックスハイライト用のパッケージです。
![056.png](https://qiita-image-store.s3.amazonaws.com/0/34961/8e12d699-2d04-881b-830b-c5eee8699e79.png)


#最後に
並べただけ、という感じの記事になってしまいました。申し訳ございません。
新しい言語を学ぶときに、自分の使いたいエディターで書ける、というのは結構大きいのではないかと思いこの記事を書かせていただきました。
このエディタがない!という意見はコメントにおいて書いていただけると幸いです。出来る限り探してみたいと思います。
また、自分でプラグインを作るのもいいと思います。言語の理解にもつながるところがあると思います。

以上sh4869でした。明日は[laco0416](http://qiita.com/laco0416)さんです。


###参考サイト
[Dart用Emacsモード|プログラマー図雑記帳](http://yohshiy.blog.fc2.com/blog-entry-179.html)
[Emacs講座 -第6回- load-path / マスタカの ChangeLog メモ](http://masutaka.net/chalow/2009-07-05-3.html)