vimshell は git でダウンロードする。

$ git clone git://github.com/Shougo/vimshell.git

ダウンロードしたファイルをそれぞれ ~/.vim 以下にコピーする。

vimshell 上で Clojure の REPL を動かすには、vimproc を使って非同期実行する必要があるようなので vimproc も git でダウンロードする。

$ git clone git://github.com/Shougo/vimproc.git

そして、proc.so を make する。

$ make -f make-gcc.mak # Ubuntu
$ make -f make-mac.mak # Mac

コンパイル後に作成した proc.so と vimproc.vim を ~/.vim/autoload/ へコピーし、doc/vimproc.jax を ~/.vim/doc/ へコピーする。
~/.vim/ を Dropbox で共有していたので、Ubuntu 用と Mac 用とに分けるために、それぞれ procmac.so、procunix.so としてコピーした。

.vimrc に以下の設定を記述する。

" vimproc
if has('mac')
    let g:vimproc_dll_path = $HOME."/.vim/autoload/procmac.so"
elseif has('unix')
    let g:vimproc_dll_path = $HOME."/.vim/autoload/procunix.so"
endif

" vimshell
let g:VimShell_EnableInteractive = 1

VimShellInteractive による Clojure REPL の起動と、VimShellSendString で選択範囲のコードを vimshell 上の Clojure REPL に送るためのキーバインド設定を行う。
~/.vim/ftplugin/clojure/vimshell-clojure.vim ファイルを作成して以下の記述をする。

:command! CLJVimShell execute ":VimShellInteractive clj"

vmap <silent> ,s :VimShellSendString<cr>

これで、vimshell を起動して、Clojure のコードを選択し、,s キーを押下すると vimshell 上の Clojure REPL でコードが実行される。

VimClojure に比べてサーバの起動は不要だし、シェルがシンタックスハイライトされるし、neocomplcache で補完が使えるので、イイ♪

今まで、無意識に :e をタイプしていたれど、:edit コマンドの e だったんだ。

Vimcasts (vimcasts.org)

プラグインのインストールは上記サイトからダウンロードしたファイル内の vim/ftplugin/ 内のファイルを ~/.vim/ftplugin/ にコピーする。
プラグインの実行には python2.5 以上が必要。

<c-e> を押すことで、タグキーワード（div, h1, img, meta 等）から開始タグ・終了タグ・各種属性を自動で入力できる。

<c-n> を押すことでカーソルを次の入力位置に移動できる。

CSS 風のセレクタ表記を使ったショートカット文字列から HTML タグ文字列に展開される。

タグ単体の入力

タグキーワードを入力して <c-e> を押す。

div <= <c-e> を押す

<div></div>

属性値を含めて入力

id の場合は # 、class の場合は . でタグキーワードと属性値を繋ぐ。
タグを省略した場合は div タグとして処理される。

div#hoge.foo <= id が hoge, class が foo の div タグ

<div class="foo" id="hoge"></div>

その他の属性値の場合は属性名を指定する。

a[href=http://www.google.com/].foo#hoge <= id が hoge, class が foo の Google へのリンク

<a href="http://www.google.com/" class="foo" id="hoge"></a>

img[width][height][title=テスト] <= width, height 属性を持ち title テキストが"テスト"の img タグ

<img width="" src="" height="" alt="" title="テスト" />

タグに囲まれたテキスト

タグに囲まれたテキストは {} で囲んだテキストを繋ぐ。

a[href]{This is link test}

<a href="">This is link test</a>

子要素を含めて入力

子要素を含めて入力する場合は、子要素を > で繋ぐ。

div > span.wrap <= class が wrap の span タグを子要素に持つ div タグ

<div>
    <span class="wrap"></span>
</div>

要素を連続して入力

要素を連続して複数入力する場合は、要素名の後に *n のようにして * と要素数を記述する。

select > option*4 <= 4つの option タグを持つ select タグを入力

<select name="">
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
</select>

連続して入力するタグに連番を使った処理を加える

連続して入力するタグに $ の記述を追加すると連番に展開される。

select > option[value=$].item-$*5 <= 5つの option タグの value と class に連番を加える

<select name="">
    <option class="item-1" value="1"></option>
    <option class="item-2" value="2"></option>
    <option class="item-3" value="3"></option>
    <option class="item-4" value="4"></option>
    <option class="item-5" value="5"></option>
</select>

隣接した異るタグを入力する

同じ階層の隣接した異なるタグ（タグ自身や属性の相違）を続けて入力するには + で各タグを繋いていく。

p.foo + p.hoge + img

<p class="foo"></p>
<p class="hoge"></p>
<img src="" alt="" />

階層を1つ上に戻す

< を使うことで1度掘り下がった階層を1つ上に戻すことができる。

div > ul > li.items*3 < p.foot < #foot

<div>
    <ul>
        <li class="items"></li>
        <li class="items"></li>
        <li class="items"></li>
    </ul>
    <p class="foot"></p>
</div>
<div id="foot"></div>

少し複雑なテーブルを作る

table[border=1] > tr*3 > th.title{TITEL} + td*2{CONTENTS} + td.foot{FOOTER} < tr > th.foot[colspan=4]{FOOTER}

<table cellspacing="0" border="1">
    <tr>
        <th class="title">TITEL</th>
        <td>CONTENTS</td>
        <td>CONTENTS</td>
        <td class="foot">FOOTER</td>
    </tr>
    <tr>
        <th class="title">TITEL</th>
        <td>CONTENTS</td>
        <td>CONTENTS</td>
        <td class="foot">FOOTER</td>
    </tr>
    <tr>
        <th class="title">TITEL</th>
        <td>CONTENTS</td>
        <td>CONTENTS</td>
        <td class="foot">FOOTER</td>
    </tr>
    <tr>
        <th colspan="4" class="foot">FOOTER</th>
    </tr>
</table>

HTML タグ・テンプレートの入力

各 DOCTYPE 宣言を含んだ HTML タグ・テンプレート を入力する。
html: の後に各 DOCTYPE 宣言のショートカット文字列(type)を記述する。

html:type

各 DOCTYPE 宣言とショートカットの一覧

HTML 4.01 Transitional

html:4t

HTML 4.0.1 Strict

html:4s

XHTML 1.0 Transitional

html:xt

XHTML 1.0 Strict

html:xs

XHTML 1.1

html:xxs

HTML 5

html:5

入力例

以下の例では lang 属性が ja になるように ~/vim/ftplugin/html/sparkup.py ファイルを修正している。

html:5 <c-e> を押すと以下のタグが入力される

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8" />
    <title></title>
</head>
<body>

</body>
</html>

IE 用条件付きコメント分岐タグ

cc: の後に IE の各バージョンを表わす文字列(type)を記述する。

cc:type

IE の各バージョンとショートカットの一覧

IE （全てのバージョン）

cc:ie

IE6 以下

cc:ie6

IE7 以下

cc:ie7

IE以外

cc:noie

入力例

cc:ie <c-e> を押すと以下のタグが入力される

<!--[if IE]><![endif]-->

その他

その他、入力フォーム・メタタグ・スクリプトタグの入力ショートカットや、入力ショートカットの省略形などが定義されている。
詳細は ~/.vim/ftplugin/html/sparkup.py のコードを参照する。

追記：コードを参照してショートカットを調べるのが面倒なので vim のヘルプファイルを作りました。
sparkup-keys-help.zip

追記：CSS 用の Zen Coding Vim Script を作りました。zencodingcss.vim (Vim Scirpt)

参考サイト：rstacruz’s sparkup at master – GitHub
　　　　　　YouTube – Sparkup with MacVIM

.vimrc に記述する g:NeoComplCache_CachingDisablePattern オプションにバッファ名パターンを指定するとよい。
指定する値は正規表現文字列、 \| で区切ると複数のパターンを指定できる。

let g:NeoComplCache_CachingDisablePattern = '\.crypt$\|\.hoge$'

所有者を変更したらエラーは発生しなくなった。

MacPorts のファイルを sudo vi で修正した時に作られたのかな。

CSS の編集ではクイックマッチをOFFに、その他のファイルの編集ではONにしている。

autocmd BufEnter * let g:NeoComplCache_EnableQuickMatch = 1
autocmd BufEnter *.css let g:NeoComplCache_EnableQuickMatch = 0

追記：neocomplcache Version 2.77 でクイックマッチの挙動が改良されたので、上記の設定の必要がなくなりました。

ところが、日本語変換についてもっと大きな問題を発見した。
ATOK2008で日本語変換する際に、文節に分かれた変換文字列が入れ替わってしまうという問題が発生する。
変換対象のアンダーラインが表示されている状態で、Enter で確定せずに次の文字を入力すると発生するらしい。

言葉で説明するのが難しいのでスクリーンキャストを撮ってみた。
"新幹線大爆破新幹線大爆破！" となるはずが "新幹線新幹線大爆破新幹線！" となってしまう。

追記：20091020版 でATOK2008でも問題なく入力できるようになった。
入力に問題のないIMを使っていて、インラインIM入力を有効にするには『環境設定…』から『詳細』を選び『インラインインプットメソッドを使用する』にチェックをいれる。

これまで使っていた 20090802版では変換中の文字がわずかに上にずれて表示されていたのが、20090903版では変換中の文字も変換確定後の文字と同じ高さに収まっている。
ところが、この処理の副作用なのか、20090903版では変換中の文節のアンダーラインの太さが全て同じ太さになってしまっている。
20090802版では変換中の文字の現在変換処理対象の文字のアンダーラインが少し太く表示される。

また、20090903版ではカーソル位置が変換中の文字列の先頭に移動してしまい変換中の文節の位置が分かりにくくなってしまった。

文節の変換候補をカーソルの矢印で選択しようとすると、その文節が消えてしまう問題もあった。
ただし、この問題はスペースバーで変換候補を選択する習慣の自分にとってはあまり問題にはならないかも。

こちらのプラグインでは、カラーコードだけではなく色名（例：white）でもハイライトされる。
さらに256色表示ができるターミナルならば、ターミナル上の Vim でもハイライト表示できる。
ただし、ターミナルでは css、html ファイル編集時に Vim の起動が遅くなってしまった…

追記：ターミナルでの Vim の起動速度の問題は、1つ前のバージョン 0.6 を使えばよい。
ただし、ターミナルでのハイライト表示はできなくなる。

このプラグインのインストールは ~/.vim/after/syntax/css.vim のようにファイルを配置するだけ。

追記：rgb()/rgba() に対応した CSS color preview もあった。

正規表現がテキトーだけど、希望通りの動作になってくれた。

if !exists('g:NeoComplCache_OmniPatterns')
    let g:NeoComplCache_OmniPatterns = {}
endif
let g:NeoComplCache_OmniPatterns['css'] = '\v^\s+\w+|\w+[):;]?\s+|[@!]'

ネオコン、以前のバージョンよりもキャッシュされるのが速くなってきた。