Visual Studio Code

Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Linux, macOS and Windows.

See also viatsko/awesome-vscode for a curated list of delightful VS Code packages and resources.

Install

Ubuntu (deb)

curl -fsSL https://packages.microsoft.com/keys/microsoft.asc | sudo gpg --dearmor -o /usr/share/keyrings/packages.microsoft.gpg
echo "deb [arch=amd64 signed-by=/usr/share/keyrings/packages.microsoft.gpg] https://packages.microsoft.com/repos/code stable main" | sudo tee /etc/apt/sources.list.d/vscode.list > /dev/null
sudo apt update && sudo apt install -y code

snap

sudo snap install code --classic

Windows

chocolatey:

choco install vscode

winget:

winget install vscode

VSCode Settings

Change VS Code UI font

1. Install the Customize UI plugin and restart VS Code.¹
2. In VS Code Settings, set Customize UI Font:Monospace and/or Customize UI Font:Regular to your liking.

Better-looking menu bar

Add this entry to settings.json (Ask Ubuntu thread)

{
  "window.titleBarStyle": "custom",
}

Reload VSCode to apply the changes.

Line height

You can increase line height to make you code look better.

Search for Line height in VSCode settings and set it to a higher number. (For example, 1.4)

Markdown settings

Markdown in VSCode

• Link validation: set "markdown.validate.enabled": true.
• Automatic link updates: set "markdown.updateLinksOnFileMove.enabled": prompt

VSCode extensions

• Luna paint: A raster image editor extension for VSCode.
• TeXLab: An implementation of the Language Server Protocol for LaTeX.
• Live server
• Live Share
• Draw.io Integration
• Remote Development: Develop in WSL, remote SSH, etc.

Themes

VSCode themes

• Atom One Dark Theme
• Material Icon Theme

Version control and continuous integration (CI)

• Git Graph: View a Git Graph of your repository, and perform Git actions from the graph.
• GitHub Pull Requests: Pull Request and Issue Provider for GitHub.
• GitHub actions

Formatting

• Editor config for VS code: generate editor config files in VSCode.
• Code Spell Checker
• Even Better TOML
• YAML
• Markdown All in One

View files

• MPEG4 preview: Simple preview for MPEG-4 (.mp4) video files in VSCode.
• GitHub Markdown Preview: GitHub-flavored Markdown for VSCode.
• vscode-pdf: PDF (.pdf) documents.
• Rainbow CSV
• TIFF Preview: TIFF (.tif) images.

---

1. https://stackoverflow.com/questions/57008558/how-to-change-the-font-of-visual-studio-codes-ui ↩

Comments