VS Codeで選択範囲のテキストの大文字／小文字を切り替えるには：Visual Studio Code TIPS

VS Codeで選択範囲を一括して大文字／小文字に切り替える方法や、change-case拡張機能を使ってより高度な大文字小文字の変換を行う方法を紹介する。

» 2018年08月24日 05時00分公開

　Visual Studio Code（以下、VS Code）で、選択範囲に含まれるテキストを一括して大文字あるいは小文字に変換する方法を説明する。


	操作
選択範囲のテキストを大文字／小文字に	コマンドパレットから［大文字に変換］コマンド／［小文字に変換］コマンドを実行
選択範囲のテキストをsnake_case／camelCase／kebab-caseに	change-case拡張機能を利用
選択したテキストの大文字／小文字を切り替える方法

選択範囲のテキストを大文字／小文字にする

　選択範囲のテキストを一括して大文字／小文字に変換するには、コマンドパレットから［大文字に変換］（Transform to Uppercase）コマンドか［小文字に変換］（Transform to Lowercase）コマンドを実行すればよい（試してみたところ、全角／半角の英文字が変換できた）。以下に例を示す。

選択範囲のテキストを大文字／小文字に変換

　上のGIFアニメでコマンドパレットを見ると、キーボードショートカットが割り当てられていないことが分かる。例えば、本家Visual Studioでは大文字への変換には［Ctrl］＋［Shift］＋［U］キー、小文字への変換には［Ctrl］＋［U］キーが割り当てられている。

　Windows版のVS Codeで、これと同じキーボードショートカットに設定するには（macOSなら対応する［Shift］＋［Command］＋［U］キーや［Command］＋［U］キー）、［ファイル］メニュー（macOSでは［Code］メニュー）から［基本設定］－［キーボードショートカット］を選択して、「transformTo」などでコマンドを検索して、「editor.action.transformToUppercase」コマンドと「editor.action.transformToLowercase」コマンドにショートカットキーを割り当ててやればよい。

「editor.action.transformToLower」コマンドに［Ctrl］＋［U］キーを割り当てているところ

　ただし、上の画像に「1つの既存のコマンドがこのキーバインドを使用しています」とあるように、VS Codeではデフォルトで［Ctrl］＋［Shift］＋［U］キー（［Shift］＋［Command］＋［U］キー）と［Ctrl］＋［U］キー（［Command］＋［U］キー）には既にコマンドが割り当てられている（Ubuntu版のVS Codeでは［Ctrl］＋［Shift］＋［U］キーにはコマンドが割り当てられていなかった）。

　そのため、ここでは「範囲選択が行われていること」（editorHasSelection）と「エディタにフォーカスがあること」（editorTextFocus）を条件として、keybindings.jsonファイルに記述されたキーバインドを次のように変更している。

[
// …… 省略 ……
{
    "key": "ctrl+shift+u",
    "command": "editor.action.transformToUppercase",
    "when": "editorHasSelection && editorTextFocus"
},
{
    "key": "ctrl+u",
    "command": "editor.action.transformToLowercase",
    "when": "editorHasSelection && editorTextFocus"
}
// …… 省略 ……
]

範囲選択が行われ、エディタにフォーカスがあるときに［Ctrl］＋［Shift］＋［U］キー／［Ctrl］＋［U］キーで、選択範囲のテキストを大文字／小文字に変換するキーバインドの設定

　変数名をsnake_caseにしたり、camelCaseにしたり、kebab-caseにしたり、あるいは選択したテキストの各単語の先頭だけを大文字にしたりといったことまでを手軽に行いたいのであれば、change-case拡張機能を使用するとよい。

change-case拡張機能

　今も述べた通り、change-case拡張機能は選択した範囲に含まれるテキストをさまざまな大文字小文字の並びに一括して変換してくれる機能だ。

change-case拡張機能

　以下はこの拡張機能が変換可能な形式の例だ。

snake_case：単語は全て小文字として、アンダースコアでそれらをつなぐ
camelCase：単語間に何も挟まずに全ての単語をつなぎ、先頭以外の単語の最初の文字を大文字に刷る
kebab-case：単語は全て小文字として、ハイフンでそれらをつなぐ
title：各単語の最初の文字だけ大文字にする

　これらの他にも、さまざまな形式に変換できる。この拡張機能をインストールした後は、コマンドパレットに「change case camel」などと入力して特定の形式に変換するコマンドをそのまま実行するか、「change case command」などと入力してからドロップダウンで変換後の形式を選択することで、選択範囲のテキストの大文字小文字を変換できる。以下にこの拡張機能を使って、変数名をさまざまな形式に変換している例を示す。