Visual Studio Codeでやっておいた方がよい設定 メイン画像

Visual Studio Codeでやっておいた方がよい設定

  • 公開日アイコン

Ad Area

ユーザー設定

ファイル > ユーザー設定から設定する。

タブの設定

Tabキーを打ったときのタブ数の設定 Editor: tab size で設定する

Emmetの日本語設定

emmetでhtml:5と打ったときに展開するとデフォルトでは英語設定<html lang="en">なので、日本語<html lang="ja">になるようにする。

settings.json をクリック

{
  …(略)
  "emmet.excludeLanguages": [
    "markdown"
  ],
  "emmet.variables": {
    "lang": "ja"
  }
}

不可視文字の設定

Editor:render control characters(すべてのスペースを可視化する)にチェックを入れる。

HTMLの自動整形

検索バーに html.format.enable html.format.indentinnerhtml を入力して、チェックを入れる

拡張機能

メニューの「拡張機能」アイコンから、検索ボックスで名前を検索してインストールする。

  • Japanese Language Pack for Visual Studio Code…VS CodeのUIを日本語化する
  • zenkaku…全角を可視化
  • HTMLhint…コードを間違えたときに波線でエラーを表示する

ターミナルをGit bashにする

デフォルトでPowershellになっているターミナルをGit bashに変更する。

検索バーに terminal.integrated.shell.windows を入力

setting.jsonで編集をクリックし、terminal.integrated.shell.windowsの設定値にGit bashのパスを入力する。

{
    …(略)
    "terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe",
    …(略)

}

Ad Area