vscode.md

VSCode

Prerequisites

Fonts should be installed as described in Essentials section.

Install

brew install --cask --appdir=~/Applications visual-studio-code

Plugins

Useful extensions:

• Code Spell Checker
• Git
  • GitLens
  • GitHub Pull Requests and Issues
  • GitHub Theme - Choose either Light & Dark themes
• Highlight Matching Tag
• EditorConfig for VS Code
• Material Icon Theme
• Code formatter
  • Prettier
• Markdown All in One
• GitHub Copilot
  • Getting Started with GitHub Copilot in Visual Studio Code
• Drawing
• excalidraw Editor
• Draw.io Integration
• Internationalization and localization (i18n)
  • inlang – i18n
• Monorepo
  • Monorepo Workspace helps to pick Workspaces To Focus On
• ESLint

List VS Code extension:

code --list-extensions | xargs -L 1 echo code --install-extension

installing plugins via command line

code --install-extension GraphQL.vscode-graphql

Customizations

VSCode Settings. Use settings from .vscode for new project.

Fonts

Assume you installed MesloLGM Nerd Font Mon font[font-meslo-lg-nerd-font] from essentials guide.
In your project's .vscode/settings.json file, set fontFamily for editor and terminal as shown below.

////////// Editor //////////
"editor.fontFamily": " SourceCodePro-Regular, FiraCode-Retina, Menlo",
"editor.fontLigatures": true,
////////// Terminal //////////
"terminal.integrated.fontFamily": "MesloLGM Nerd Font Mono",

Tips

General key bindings

Key	Command
option + shift + F	Format

Markdown key bindings

Key	Command
Ctrl/Cmd + B	Toggle bold
Ctrl/Cmd + I	Toggle italic
Ctrl/Cmd + Shift + ]	Toggle heading (uplevel)
Ctrl/Cmd + Shift + [	Toggle heading (downlevel)
Opt + C	Check/Uncheck task list item
Ctrl/Cmd + Shift + V	Toggle preview

References

• VS code setup for Svelte