しおしお

IntelliJ IDEAのことなんかを書いてます

htmlとcssの編集内容をChromeに同期してくれるIntelliJのプラグイン

JetBrainsさんから、htmlとcssの編集内容をChromeに同期してくれる、「Instant HTML editing」ってプラグインがリリースされたので早速入れてみたよ。
JetBrainsさんがドSっぷりを発揮して、使い方が全くわからなかったのでまとめてみたよ。

プラグインのインストール

Instant HTML editingは、Web Browser Connectorプラグインに依存しているので、Web Browser Connectorを最初に入れてからInstant HTML editingを入れてあげる必要があります。

ChromeにInstant HTML editing用のプラグインを導入

Chromeで、下記URLにアクセスしてプラグインを入れてあげます。(これが、どこにも書いてなくて全くわからなかった)
http://localhost:63363/jb.crx

なお、ローカルのファイルにアクセスすると思うので、ファイルのURLのアクセスを有効にして上げる必要があります。
f:id:sioiri:20120517230124p:plain

Instant HTML editingプラグインを有効にする

下記画像のように、Run->Instant HTML/CSS editingを有効にしてあげます。
f:id:sioiri:20120517230449p:plain

htmlの編集

編集内容を同期したいhtmlファイルをChromeで開いてあげて、あとはIntelliJで編集するだけです。
これで、編集内容がリアルタイムにChromeに反映されます。

終わり。