I got a new work laptop recently and part of the setup process was installing and configuring VS Code to match my preferences. This usually takes a bit of time because I cannot always remember all the settings and extensions that I tweak or install. I’m aware that VS Code supports syncing of settings, extensions, etc. across devices but it’s not always possible to login with my GitHub/Microsoft account. So here are the settings and extensions that I usually change/add to a brand new VS Code installation.
Settings
{
"editor.fontLigatures": true,
"extensions.autoUpdate": false,
"git.autofetch": true,
"git.confirmSync": false,
"editor.fontFamily": "'JetBrains Mono'",
"webhint.enableTelemetry": "disabled",
"editor.wordWrap": "wordWrapColumn",
"workbench.editor.untitled.labelFormat": "name",
"diffEditor.ignoreTrimWhitespace": false,
"githubIssues.queries": [
{
"label": "My Issues",
"query": "default"
},
{
"label": "All Issues",
"query": "state:open repo:${owner}/${repository} sort:created-desc"
}
],
"editor.rulers": [120],
"editor.wordWrapColumn": 120,
"screencastMode.onlyKeyboardShortcuts": true,
"gitlens.hovers.currentLine.over": "line",
"editor.fontSize": 14,
"editor.lineHeight": 21,
"terminal.integrated.fontFamily": "monospace",
"editor.tabSize": 2,
"workbench.colorTheme": "Dracula",
"workbench.startupEditor": "none",
"typescript.updateImportsOnFileMove.enabled": "always",
"editor.bracketPairColorization.enabled": true,
"typescript.inlayHints.parameterNames.enabled": "all",
"javascript.inlayHints.parameterNames.enabled": "all",
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
}
Extensions
- Angular Language Service
- CSS Flexbox Cheatsheet
- CSS Initial Value
- CSS Stacking Contexts
- Dracula Official
- es6-string-html
- ESLint
- File Utils
- Git Cheatsheet
- GitHub Pull Requests and Issues
- GitLens — Git supercharged
- Image preview
- Nx Console
- Prettier - Code formatter
- Project Manager
- RxJS Cheatsheet
- RxJS Debugging for Visual Studio Code
- Shades of Purple
- Test Focus Highlighter
- TSLint
- webhint
Git
git config --global user.name "My Name"
git config --global user.email "email@domain.com"
Fonts
- JetBrains Mono
- Fira Code (alternative)
Cover photo by Mohammad Rahmani on Unsplash
Top comments (1)
You should cross-post this to community.vscodetips.com/ !