VisualStudioCodeTips

setting.json への設定追加

Ctrl+Shift+p で setting で検索し、基本設定:設定(JSON)を開く/Preferences: Open Json(settings) を開く

対応するブラケットを強調

setting.jsonに以下を追加

{
  "editor.bracketPairColorization.enabled": true,
  "editor.guides.bracketPairs": true,
  "workbench.colorCustomizations": {
    "editorBracketMatch.background": "#ffff00"
  }
}

保存時にフォーマット

setting.json に以下を追加

"editor.formatOnSave": true

プラグイン

Japanese Language Pack for Visual Studio Code

日本語化

Highlight Matching Tag

setting.jsonに以下を追加

    "highlight-matching-tag.styles": {
        "opening": {"name":{"highlight": "yellow"}}
    },

Auto Rename Tag

終了タグも自動で修正。
#閉じてないinputタグなどが間にあるとうまく反応しなかった。

Live Server

npm で serveしなとき…?に使うかも?

Git Graph

Vetur

Prettier

.vueファイルのフォーマットは VeturではなくPrettierの方を採用。

ルートに .prettierrc を設置
(設定内容は後でもうちょっと調べて詰める…)

{
  "trailingComma": "es5",
  "tabWidth": 2,
  "semi": false,
  "singleQuote": true,
  "bracketSpacing": true,
  "quoteProps": "as-needed",
  "vueIndentScriptAndStyle": false
}

ルートに .prettierignore を設置

package.json
package-lock.json

ショートカット

コマンドパレットを開く

Ctrl+Shift+p

選択範囲の拡大・縮小

Shift+Alt+→
Shift+Alt+←

対応するブラケットに移動

Ctrl+Shift+\ (¥マーク)

同ワードの選択範囲の追加

Ctrl+d

同ワードをすべて選択

Ctrl+Shift+l

行コピー

Shift+Alt+↓

フォーマット

Shift+Alt+f
(これ、押しにくくない?)

ターミナル

PowerShellだと署名されていないスクリプトが使用できないので、ターミナル右上の+アイコン右の▽をクリックして、別のものを設定。(Git Bash にしてみた)