コーディング中、こんな「ちょっとしたストレス」を感じたことはありませんか？
「HTMLやCSSのクラス名をコピーしようとダブルクリックしたら、ハイフン（-）の手前までしか選択されなかった…」
例えば、header-logo-image のようなクラス名をコピーしたい時、ダブルクリックだと header だけがハイライトされてしまい、結局マウスでツーッとドラッグして選択し直す羽目になる、あの現象です。何度も繰り返すと地味に面倒ですよね。
実はこれ、VS Code（Visual Studio Code）の設定を少し変更するだけで、ダブルクリック時にハイフンを「単語の区切り」として無視し、一発で全体を選択できるようになるんです！
目次
設定手順
VS Codeでは、「どの記号を単語の区切りとして認識するか」がデフォルトで設定されています。この設定からハイフン（-）を取り除くだけで解決します。
- 設定画面を開く
- Windows:
Ctrl+, - Mac:
Cmd+,
- 検索バーで
wordSeparatorsと検索する Editor: Word Separatorsの項目を見つける
デフォルトの設定値には、以下のような文字列が入っています。`~!@#$%^&*()-=+[{]}|;:'",.<>/?- 文字列の中からハイフン（
-）を削除する
上記の中から-だけを消します。
（変更後：`~!@#$%^&*()=+[{]}\|;:'",.<>/?）
設定はこれだけで完了です！
ファイルを保存する必要はなく、即座に反映されます。
たったこれだけの設定ですが、CSSのクラス名や変数名などを扱う際のコーディング効率が劇的に上がります。 毎日の「ちょっとした手間」を省いて、より快適なVS Code環境を作っていきましょう！
