Visual Studio Code おすすめ設定

公開日:2019年09月12日更新日:2024年07月09日

その他

VS Code

設定変更画面

「ファイル」>「ユーザー設定」>「設定」を選択

「設定」画面が表示されるので右上のをクリックします。

設定用JSONファイルが表示されるのでおすすめ設定をコピペし「Ctrl」+「S」で設定を保存します。

VS Code おすすめ設定

{
  /* 基本設定 */
  "editor.fontSize": 18, // エディター文字サイズ
  "debug.console.fontSize": 16, // コンソール文字サイズ
  "terminal.integrated.fontSize": 16, // ターミナル文字サイズ
  "editor.formatOnPaste": true, // ペースト時自動フォーマット
  "editor.formatOnSave": true, // 保存時自動フォーマット
  "editor.formatOnType": true, // 入力時自動フォーマット
  "editor.tabSize": 2, // タブ文字数
  "editor.detectIndentation": false, // タブルールを自分のタブルールに変更する
  "editor.mouseWheelZoom": true, // マウスホイール文字サイズ変更：Ctrl + ホイール
  "editor.renderControlCharacters": true, // 制御文字表示
  "editor.renderLineHighlight": "all", // 選択行の行番号ハイライト
  "editor.renderWhitespace": "all", // ホワイトスペース（半角スペース等）の表示
  "editor.minimap.renderCharacters": false, // ミニマップの文字をブロック表示
  "editor.minimap.showSlider": "always", // ミニマップ表示領域をハイライト
  "editor.bracketPairColorization.enabled": true, // ブラケットを色分け表示
  "editor.suggestSelection": "recentlyUsedByPrefix", // 候補リストの設定
  "explorer.compactFolders": false, // エクスプローラの省略表示しない
  "files.insertFinalNewline": true, // 保存時に末尾を空行にする
  "files.trimFinalNewlines": true, // 保存時に最終行以降を削除
  "files.trimTrailingWhitespace": true, // 保存時に行末のホワイトスペースを削除
  "workbench.editor.wrapTabs": true, // 多段タブ表示
  "window.zoomLevel": 0, // 画面全体の表示サイズ
  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}", // フルパス表示
  "window.commandCenter": false, // コマンドセンター表示
  "window.enableMenuBarMnemonics": false, // 画面幅が狭い時にメニューバーをハンバーガーメニューにしない
  /* キー変更 */
  "editor.multiCursorModifier": "ctrlCmd", // マウスでカーソル複数作成時のキー変更
  /* 文字コード */
  "files.autoGuessEncoding": false, // 文字コード自動判別（ワークスペースで文字コード設定する）
  /* エクスプローラー */
  "files.associations": { // ファイルと言語の関連付けを変更
    ".tpl": "php"
  },
  "files.exclude": { // 非表示にするファイル
    "**/.DS_Store": true
  },
  "search.exclude": { // 検索結果から除外するファイル
    "**/tmp/cache": true
  },
  /* HTML */
  "html.format.extraLiners": "", // <head>,<body>,</html>タグ前に空行を入れない
  "html.format.contentUnformatted": "pre, code, textarea", // フォーマットしない要素を指定
  "html.format.unformatted": null, // インライン要素をフォーマットしない
  "[html]": {
    "editor.hover.enabled": false, // ホバー時メッセージ表示
  },
  /* Emmet */
  "editor.snippetSuggestions": "top", // Emmetのスニペット候補を優先表示
  "emmet.showSuggestionsAsSnippets": true, // Emmetの候補を表示
  "emmet.triggerExpansionOnTab": true, // TABキーでEmmet展開
  "emmet.variables": { // Emmet展開のHTML言語変更
    "lang": "ja"
  },
  /* htmltagwrap：拡張 */
  "htmltagwrap.tag": "div", // ラップ時初期タグ
  "htmltagwrap.autoDeselectClosingTag": true, // 閉じタグ半角スペース入力時選択解除
  /* Live Server：拡張 */
  "liveServer.settings.CustomBrowser": "chrome", // 表示ブラウザ
}

Java用

    /* Java */
    "java.home": "C:\\Program Files\\Java\\jdk1.8.0_XXX",
    "maven.terminal.useJavaHome": true,
    "[java]": { // Javaファイルの文字コードをSJISにする
        "files.encoding": "shiftjis"
    },
    "java.debug.settings.enableRunDebugCodeLens": false,

講師用

    /* 講師用 */
    "editor.cursorWidth": 3, // カーソル幅
    "editor.glyphMargin": false, // 行番号グリフマージン削除
    "editor.tokenColorCustomizations": {
        "comments": "#FF0000" // コメント色変更
    },
    "workbench.colorTheme": "Default Light Modern",  // 配色テーマ
    "editor.stickyScroll.enabled": false,  // HTML親要素上部固定表示を無効

以上で設定終了です。

コンテンツ一覧

同じタグのコンテンツ