devdocs.io が便利すぎたので Vim プラグインつくった

Vim document

devdocs.io

最近，GitHub Trending Repositories のページで devdocs.io という便利なサービスを知りました．

f:id:rhysd:20151111205826p:plain

devdocs.io は複数のドキュメントを素早く横断的に検索できるサービスです．多分使ってみると一瞬で分かるので詳細は省きますが，各言語や DOM，React などのフレームワークのドキュメントをサクッと検索できます．どのドキュメントを有効/無効にするかも選択でき，IndexDB を使ってローカルにドキュメントを置くことでローカルでも利用できます．いつでも devdocs.io を開くだけで使えますし，モバイル対応もしています．

また，Ruby 2.2 と Node.js が入っていればローカルでも簡単に立てられます．デフォルトでもウェブデベロッパーにとってうれしいドキュメントがたくさん入っていますが，さらに Scraper を使ってローカルの devdocs に新しいドキュメントを追加することもできるようです.

devdocs.vim とは

ここ数日試しに使ってみて，なかなか使い勝手が良かったので Vim 内から直接 devdocs.io を開けるようにプラグインを作りました．

rhysd/devdocs.vim

主な目的は下記の2つです．

  • Vim の既存の K マッピングを使って，カーソル下の単語をすぐに devdocs.io で検索したい
  • ファイルタイプに特定のドキュメントを紐付けたい

Vim の既存の K マッピングを使って，カーソル下の単語をすぐに devdocs.io で検索したい

Vim にはカーソル下の単語を直接ドキュメント検索できる K というマッピングがあり，デフォルトでは Vim のヘルプを開いたり man を開いたりできます．この K を下記のように特定のファイルタイプだけ devdocs.io で開くように設定できます．

augroup plugin-devdocs
  autocmd!
  autocmd FileType c,cpp,rust,haskell,python nmap <buffer>K <Plug>(devdocs-under-cursor)
augroup END

例えば上記では C, C++, Rust, Haskell, Python のコードを書いている時に K で直接 devdocs.io を開きます．

ファイルタイプに特定のドキュメントを紐付けたい

例えば，僕は JSX なコードには javascript.jsx というファイルタイプを割り当てていて，この時は React.js のドキュメントだけ見たいとします．また，devdocs.io には TypeScript のドキュメントはありませんが，TypeScript を書いている時は JavaScript のドキュメントが役に立つので，TypeScript を書いている時は JavaScript のドキュメントを開きたいとします．その場合は下記のように設定すると，各ファイルタイプでページを開いた時のデフォルトのドキュメントを指定できるようにしました．

let g:devdocs_filetype_map = {
    \   'typescript': 'javascript',
    \   'javascript.jsx': 'react',
    \ }

ローカルの devdocs.io を開きたい

変数で指定できるようにしました．

let g:devdocs_host = 'localhost:9292'

その他の devdocs.io クライアント

下記のようなツールがあります．便利そう…