mieki256's diary

Windows上で動作する Notepad++ というエディタに、Emmetプラグインをインストールしてみた。

動作確認環境は以下。

• Windows10 x64 20H2
• Notepad++ 7.9.5 32bit

_emmetio/npp: Emmet plugin for Notepad++

上記ページの、「Download EmmetNPP」のリンクをクリックして、emmet-npp.zip を入手する。バージョンは 1.0.2 らしい。

動作には、Notepad++ のプラグイン、PythonScript が必要になる。Notepad++ を起動して、プラグイン → プラグイン管理。PythonScript を選んでインストール。今回は PythonScript 1.5.4 がインストールされた。

ダウンロードした emmet-npp.zip を解凍すると、以下の2つが出てくる。

EmmetNPP/
EmmetNPP.dll

Notepad++ インストールフォルダ\plugins\ 以下に、EmmetNPPフォルダを移動して、その中に EmmetNPP.dll も移動する。以下のようなファイル構成になる。

EmmetNPP\emmet
EmmetNPP\_PyV8.pyd
EmmetNPP\editor.js
EmmetNPP\EmmetNPP.dll
EmmetNPP\npp_emmet.py
EmmetNPP\PyV8.py

デフォルトでは、Emmet を動作させるショートカットキーとして、Ctrl + Alt + Enter 等が割り当てられているが、そのショートカットキーには、元々「カーソル行の(上|下)に空行を挿入」が割り当てられてしまっているので、このままだと Emmet は動作しない。今回は、Ctrl + E や Ctrl + Shift + E に割り当て直して解決した。

• 設定 → ショートカット管理 → プラグイン。
• Expand abbreviation : Ctrl + E
• Wrap with abbreviation : Ctrl + Shift + E

一応、念のために、Notepad++ を再起動。

Emmetの動作確認。

• 「html:5」と打ってから、Ctrl+E。
• 「div#classid」と打ってから、Ctrl+E。
• 「ul>li*5」と打ってから、Ctrl+E。
• 「lorem」と打ってから、Ctrl+E。

それぞれ展開がされるはず。