Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
December 10, 2022 02:46 pm GMT

Visual Studio Code Customization

Why?``
I am using Visual Studio code since 2018 and this time I created lots of projects with this code editor. VS Code is my favorite code editor. It's fast and flexible. no matter which operating system I am using VS code is my go-to editor. Over a long period of time, I needed lots of modifications, I changed the look, features, extensions as well as theme. No theme is perfect for my personalization, so I customized a theme in my way. Also, I like to customize extension features. So every time why I set up a new work environment I need to do it manually. So, I uploaded all settings here. So I can do this fast. You can use any one of them.

`

VS Code Settings

{
"editor.fontFamily": "Operator Mono, Fira Code",
"editor.fontSize": 20,
"editor.tabSize": 2,
"editor.wordWrap": "on",
"editor.cursorSmoothCaretAnimation": true,
"editor.cursorBlinking": "expand",
"prettier.proseWrap": "always",
"editor.formatOnSave": true,
"editor.formatOnPaste": true,
"editor.formatOnType": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
},
"workbench.colorCustomizations": {
"editorGroupHeader.tabsBackground": "#2c2c54",
"activityBar.background": "#2c2c54",
"sideBar.background": "#141422",
"minimap.background": "#141422",
"tab.activeBackground": "#706fd3",
"tab.inactiveBackground": "#191846",
"terminal.border": "#2c2c54",
"terminal.background": "#2c2c54",
"statusBar.background": "#474787",
"scrollbarSlider.background": "#474787",
"scrollbarSlider.hoverBackground": "#706fd3"
},
"editor.tokenColorCustomizations": {
"comments": "#95afc0"
},
"editor.linkedEditing": true,
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs": true,
"editor.guides.bracketPairsHorizontal": true,
"editor.hover.enabled": false,
"window.zoomLevel": 1,
"files.autoSave": "afterDelay",
"files.autoSaveDelay": 10,
"liveServer.settings.CustomBrowser": "chrome:PrivateMode",
"liveServer.settings.donotShowInfoMsg": true,
"liveServer.settings.donotVerifyTags": true,
"liveSassCompile.settings.formats": [
{
"format": "compressed",
"extensionName": ".min.css",
"savePath": "/css"
}
],
"liveSassCompile.settings.generateMap": false,
"workbench.iconTheme": "material-icon-theme",
"workbench.colorTheme": "Andromeda",
"workbench.editor.enablePreview": false,
"terminal.integrated.defaultProfile.windows": "Git Bash",
"terminal.integrated.fontSize": 20,
"terminal.integrated.fontWeight": null,
"diffEditor.wordWrap": "on",
"bracketPairColorizer.depreciation-notice": false,
"security.workspace.trust.untrustedFiles": "open"
}

`

VS Code Extension

Auto Close Tag
Auto Rename Tag
Debugger for Chrome
indent-rainbow
HTML CSS Support
JavaScript (ES6) code snippets
Live Server
Live Sass Compiler
Material Icon Theme
Prettier - Code formatter
WordPress Snippets
Simple React Snippets

VS Code Themes

Andromeda
Dracula Official
Night Owl
Shades of Purple
SynthWave '84

Ayu (Theme)

Font Info
Fira Code
Operator Mono


Original Link: https://dev.to/abrarmehedi/visual-studio-code-customization-40mh

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To