vimでMarkdown記法をローカルでプレビューしたい

MarkdownでgithubのREADMEやはてなブログの記事をMarkdownで書いているとプレビューしたくなります。

今まではgithubであれば、addしてcommitしてpushしてブラウザで更新して間違っている箇所を修正という非常にめんどくさい作業を繰り返してました。。。

そこで、vimで編集してローカルでプレビューしたくなり、色々調べたら良いプラグインを見つけたので紹介したいと思います。

vimにプラグインを導入したいのですが、プラグインを管理するためにNeoBundleを使った方法を紹介します。 もしNeoBundleがインストール済みであれば2節から読んでください。

1. NeoBundleのインストール方法

NeoBundleはプラグインの導入やアップデートが簡単になります。

$ mkdir ~/.vim/bundle
$ git clone https://github.com/Shougo/neobundle.vim ~/.vim/bundle/neobundle.vim

また、vimrcに以下の記述を追加します。

" Note: Skip initialization for vim-tiny or vim-small.
if 0 | endif

if &compatible
set nocompatible " Be iMproved
endif

" Required:
set runtimepath+=~/.vim/bundle/neobundle.vim/

" Required:
call neobundle#begin(expand('~/.vim/bundle/'))

" Let NeoBundle manage NeoBundle
" Required:
NeoBundleFetch 'Shougo/neobundle.vim'

" My Bundles here:
" Refer to |:NeoBundle-examples|.
" Note: You don't set neobundle setting in .gvimrc!

call neobundle#end()

" Required:
filetype plugin indent on

" If there are uninstalled bundles found on startup,
" this will conveniently prompt you to install them.
NeoBundleCheck

2. vimにプラグインを導入

必要なプラグインをインストールします。 NeoBundleをインストールしていれば、

NeoBundle 'plasticboy/vim-markdown'
NeoBundle 'kannokanno/previm'
NeoBundle 'tyru/open-browser.vim'

と記述して保存するだけで大丈夫です。 その後

:NeoBundleInstall

でプラグインを導入するか、次にvimを開いたときにインストールするか聞かれるのでyesと答えればインストールが始まります。

最後に.md拡張子ファイルもmarkdownとなるように

au BufRead,BufNewFile *.md set filetype=markdown

と記述して終わりです。

3. 実行方法

vimでMarkdown記法で編集します。 その後

:PrevimOpen

と打つとローカルで表示されます。

4. 結果

結果