一般的によく使われているテキストエディタでのEmmetの設定方法まとめ

Web業界でよく使われている下記のテキストエディタでの、Emmetの使用方法や、カスタマイズ場所をまとめておきます。
- Visual Studio Codee
- Atom
- Brackets
- SublimeText
- Dreamweaver
Emmet自体の使い方に関しては別で記事を書いているので、そちらを参考にしてください。
Visual Studio Code
Visual Studio Codeではデフォルトの状態でEmmetが入っていて(一応拡張機能扱いですが)、設定は[環境設定]→[拡張機能]→[Emmet]から設定できます。

ちなみに[環境設定]→[拡張機能]→[Emmet]の「Trigger Expansion On Tab」にチェックを入れていないと、tabを押してもうまく展開されないので、注意してください。
Atom
Atomの場合はパッケージを入れる必要があります。
[環境設定]→[インストール]にて「emmet」と検索してパッケージをインストールします。

これでEmmetが使えるようになります。
Brackets
Bracketsの場合は拡張機能をインストールします。
逆EmmetというHTMLをEmmetに戻すという拡張機能もあります(Emmetの勉強に使えそうです)。

Sublime Text
Sublime Textもパッケージのインストールが必要です。
command + shift + Pでコマンドパレットを呼び出し、「Package Control: Install Package」を入力して選択します。
再度検索ボックスが表示されるので、「Emmet」と検索して選択すればEmmetがインストールされます。

Dreamweaver
Dreamweaverはデフォルトの状態でEmmetがインストールされています。
1点設定できる項目として、[環境設定]→[コードフォーマット]の「Tabキーを使用して略語を展開」にチェックが入っていないと、tabを押してもEmmetが展開されないので注意してください。



Stationの「My custom apps」機能を使って好きなウェブサイトをStationに追加する
Alfred Workflowで、AppleScriptを使ってFinderとPath Finderの現在開いているパスを取得する方法
Macでダブルクォーテーションを入力すると自動で変換されてしまうのを無効にする
macOSのシステム環境設定「通知」の設定見直し
サイト上のSVG画像を簡単に保存できるChrome拡張機能「svg-grabber」
Karabiner-Elementsを使ってキーボードを快適に使えるように設定する
Workspacesの特定ワークスペースのURLを取得・実行する方法
Alfredからメニューバーの項目を検索・実行するWorkflow「Menu Bar Search」
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
BetterTouchToolでウインドウをアクティブにしないで移動する方法
Visual Studio Codeで簡易的なローカルサーバーを起動して、コード保存時に自動でブラウザをリロードする拡張機能「Live Server」
食事中にできる、食べることに集中する「マインドフルイーティング」
緊張や不安をほどいてリラックスする「ボディスキャン」瞑想のやり方
Visual Studio Codeのファイル横に表示されるファイルアイコンのテーマまとめ
Chrome拡張機能「PocketTube」を使って、YouTubeの登録チャンネルをグループ分けして管理する
通知パネルの「閉じる」クリックをショートカットキーで行う方法
Movable TypeでMTLoopを使ってkeyでソートしたときに、10個以上表示させると並びがおかしくなる
Macでfnキーを2回押すと音声入力が起動するのを無効化する方法
Google Chromeのブックマークバーを「新しいタブ」でも非表示にしたい