TypeScriptのTSServerとVim plugin

## TypeScript 1.5.0-alpha

[TypeScript 1.5.0-alphaがリリース](http://blogs.msdn.com/b/typescript/archive/2015/03/27/announcing-typescript-1-5-alpha.aspx)されましたね!

TypeScriptの1.5では, ES6対応や, Annotation(Decorator)等の言語の対応だけでなく, TSServerというエディタ向けツールが含まれています.
TSServerは, コンパイルやリファクタリングなど、エディタに必要な機能を提供するServerです. 標準入出力を介して, エディタに様々な情報を提供してくれる優れものです.
[MicroSoftが提供しているSublime TextのPlugin](https://github.com/Microsoft/TypeScript-Sublime-Plugin)も, このTSServerを使って実装されています.

[TSServerの使い方等については, 別途エントリ](http://qiita.com/Quramy/items/c2835bc380c3e822d479)を起こしたので, よければ参考にしてください.

## TSServerとVim plugin

とはいえ、僕はVim使い。残念なことに, MicroSoftはVim向けのPluginまでは作ってくれませんでした.
ということで, TSServerを利用したVim plugin [tsuquyomi](https://github.com/Quramy/tsuquyomi)を作りました.

![capt_comp.png](https://qiita-image-store.s3.amazonaws.com/0/8808/63a9baa8-b328-35b5-da1d-a71d63fe28b3.png)


tsuquyomiは現状で、下記をサポートしています：

+ 補完(omni-complete)
+ Class, Method, Property等の定義箇所へジャンプ
+ Class, Method, Property等を参照している箇所へのジャンプ
+ コンパイルエラー箇所のQuickfix表示
+ Class名やMethod名の変更(rename)機能
+ Outline表示(要[unite-outline](https://github.com/Shougo/unite-outline))
+ etc...

### TL;TR
なお, TypeScriptのVim pluginという意味では, [typescript-tools](https://github.com/clausreinke/typescript-tools) と相当機能が被っていますが,  違いとして下記が挙げられます:

* typescript-toolsはv0.9.1までしか対応していない(2015.04.06時点のmaster. 対応用のbranchは出来ている模様)
* typescript-toolsにはrename機能がない
* typescript-toolsはpythonが必要だが, tsuquyomiは不要


## tsuquyomiの使い方

### Install

TypeScriptを最新化します:

```bash
npm -g install typescript
```

install後, `tsserver` コマンドが利用可能になってればOK.

tsuquyomiは[Shougo/vimproc.vim](https://github.com/Shougo/vimproc.vim)を利用します. 事前にInstallしておいてください。
(Windows版であれば, [kaoriyaのgvim](http://www.kaoriya.net/software/vim/)には最初からvimprocがバンドルされています)

Vim のplugin管理にNeoBundleを使っているのであれば, .vimrcに下記を追記して, `:NeoBundleInstall` を実行すると, vimproc, tsuquyomiの双方がinstallされます.

```vim:.vimrc
NeoBundle 'Shougo/vimproc'
NeoBundle 'Quramy/tsuquyomi'
```

vimprocは下記でruntimeをbuildしてください([https://github.com/Shougo/vimproc.vim#install](https://github.com/Shougo/vimproc.vim#install)も参照の事):

```bash
cd ~/.vim/bundle/vimproc
make
```

### 補完
なんといっても、型がある言語の一番の魅力は補完が行えることですね。
FileTypeがtypescriptであれば、omni補完が有効化されます. `<Ctrl-x><Ctrl-o>` を補完したい箇所でタイプしてください.

### 定義箇所へのジャンプ
`<Ctrl-]>` を任意のSymbol上でタイプすると, そのSymbolが定義されている箇所へジャンプします. 定義が別ファイルの場合, windowをsplitして定義箇所を表示します.
なお、同一バッファでのジャンプ後, さらに`<Ctrl-t>` をタイプすると, ジャンプ前の位置にカーソルを戻します.

### 参照箇所の表示
`<Ctrl-^>` を任意のSymbol上でタイプすると, そのSymbolを参照している箇所の一覧をlocation listで表示します.
(但し, 参照箇所として認識するのは, 現在Vimで開いているバッファに限定されます.)

### Quickfix
バッファの保存時, コンパイルエラーとなっている箇所をQuickfixウィンドウに表示します.
Ex commandとして呼び出す場合, `:TsuquyomiGeterr` を実行してください.

### CompilerOptions
TSServerにCompilerOptionsを設定するためには, [tsconfig.json](https://github.com/Microsoft/TypeScript/wiki/tsconfig.json) を作成してください.

```json:tsconfig.jsonの例
{
  "compilerOptions": {
    "noImplicitAny": true,
    "target": "es5",
    "module": "commonjs"
  }
}
```

なお、TSServerがtsconfig.jsonを読み込むタイミングは, Vimにて.tsファイルをバッファとして開いたタイミングになります. 
現状, ソースである.tsファイルをバッファに読み込み後, tsconfig.jsonを編集してもtsuquyomiの挙動に反映されません.
tsconfig.jsonを更新した際は, 下記のコマンドを実行することで, 変更した設定がTSServerへ反映されます.

```vim
:TsuquyomiReloadProject
```

### リファクタリング
SymbolのRename機能を提供します. 

名称を変更したいSymbol上にcursorを置いた状態で, `:TsuquyomiRename` を実行してください.
Symbol名が変更可能な場合, 新名称の入力を求めてきます.

注意として, 他のファイルが当該のSymbolを参照している場合, 対象のファイルもVimからバッファとして開いておく必要があります.

なお, Rename機能はデフォルトではkey mapしていませんが, `<Plug><TsuquyomiRenameSymbol>` をmapすれば呼び出せるようになります.

例えば, 下記は「,e」をマップする設定例です.

```vim:.vimrc
let mapleader = ","
noremap \ ,
augroup typescript_key_mapping
  autocmd FileType typescript nmap <buffer> <Leader>e <Plug>(TsuquyomiRenameSymbol)
augroup END
```

### Outline
[unite-outline](https://github.com/Shougo/unite-outline) が利用可能な場合, 下記のコマンドを実行することで, カレントバッファのoutlineを表示できます.

```vim
:Unite outline
```

### その他
tsuquyomiには他にも幾つか機能があります. 詳細は, [README](https://github.com/Quramy/tsuquyomi)か[help doc](https://github.com/Quramy/tsuquyomi/blob/master/doc/tsuquyomi.jax)を見てください.

## 関連plugin
tsuquyomiと併せて使うと素敵なVimライフが送れるであろうplugin達.

* [typescript-vim](https://github.com/leafgarland/typescript-vim) : *.tsのソースにSyntaxハイライトが有効化される.
* [vim-js-indent](https://github.com/jason0x43/vim-js-indent) : *.js, *.tsがいい感じにインデントされるplugin.