やりたいこと

ReactのJSXにCSS modulesなどを使って以下のように動的にクラスを適応したとします。

<div className={CSS.modal}>
  <div className={CSS.title}>タイトル</div>
  <div className={CSS.contents}>コンテンツ</div>
</div>

で、Reactの利用を途中でやめたので、className属性をのclass属性に変更したいと思います。

<div class="modal">
  <div class="title">タイトル</div>
  <div class="contents">コンテンツ</div>
</div>

Vimのバージョン

vim	7.4

結論から言ってしまうと下のようにかけます。

:%s/\vclassName\=\{CSS.(.*)\}/class="\1"/g

後方参照
Vimの置換における後方参照は置換後の文字列で\1, \2というメタ文字を利用します。

very magic mode

これ知らなかったんだけど、Vimの正規表現で利用できるメタ文字をすべて「\」記述のなしで書くことができる検索モードのようです。／(^o^)＼ｼﾗﾅｶｯﾀ
書式としては、検索文字の前に「\v」を記述するだけ。

very magic modeを利用しない場合はと言いますと、グループ用のメタ文字()をエスケープさせる必要があります。 ↓

:%s/className={CSS.\(.*\)}/class="\1"/g

ん？
今回の場合「{」がメタ文字じゃなくて通常の文字だから very magic modeじゃないほうが楽じゃない？

祝！100記事目！