Visual Studio Code Settings

Ctrl + ,

Editor: Bracket Pair Colorization => checked

Editor: Default Formatter => Prettier

Editor: Format On Save => checked

Editor: Font Size => 14

Editor: Linked Editing => checked

Editor: Tab Size => 2

Prettier: Tab Width => 2

Prettier: Single Quote => checked

Emmet: Trigger Expansion On Tab => checked

Window: Zoom Level =>1.5

Best Visual Studio Code extensions

Python

Pylance

Python Debugger

IntelliCode

Code Spell Checker

CSS Flexbox Cheatsheet

CSS Peek

Image preview

Import Cost

Prettier

SFTP

ESLint // sudo npm install eslint -g // https://www.youtube.com/watch?v=5IGVeq2DdsA

ES7 React/Redux/React-Native/JS snippets

React Native Tools

DotENV

C/C++ for Visual Studio Code ms-vscode.cpptools

C/C++ Compile Run danielpinto8zz6.c-cpp-compile-run

C/C++ Themes

CMake Tools

Doxygen Documentation Generator // for C/C++

Sass - useless

HTML CSS Support - useless

Indent-Rainbow - useless

IntelliSense for CSS class names in HTML - useless

Debugger for Chrome - deprecated

Debugger for Firefox - useless

Auto Close Tag - obsolete use Editor: Linked Editing

Auto Rename Tag - obsolete use Editor: Linked Editing

HTMLhint - deprecated - use A Static Code Analysis Tool for HTML

Live Sass Compiler - USE npm run watch:sass

Live Server - USE sudo npm install live-server -g // live-server - in terminal

Lorem Ipsum - obsolete use Emmet: Trigger Expansion On Tab <div>lorem=>Tab</div>

Bracket Pair Colorizer 2 - obsolete use Editor: Bracket Pair Colorization

Most useful features in VS Code

Ctrl + Alt + T

cd app-folder

code . // open Visual Studio Code in current folder

Alt + Z // word wrap

Ctrl + B // open or close left sidebar

Ctrl + H > Ctrl + Alt + Enter // replace all

Ctrl + P // open files

Ctrl + / // toggle comment code

Ctrl + \ // split Editor right

Ctrl + ` // ` on ~ key => toggle terminal

.  then Tab or Enter // <div className=""></div> in JSX

Install Visual Studio Code on Linux

https://code.visualstudio.com/docs/setup/linux

sudo dpkg -i code_1.100.2-1747260578_amd64.deb

sudo apt install code // if repository is added

https://code.visualstudio.com/docs/cpp/config-linux

https://code.visualstudio.com/docs/getstarted/keybindings

https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf

https://vscode-docs.readthedocs.io/en/stable/extensions/install-extension/

https://code.visualstudio.com/docs/getstarted/settings

Visual Studio Code shows red tag error

1st of all Check previous tag for potential problems!

"Visual Studio Code is unable to watch for file changes in this large workspace" (error ENOSPC)

Ctrl + Alt + T

cat /proc/sys/fs/inotify/max_user_watches

8192

nano /etc/sysctl.conf

fs.inotify.max_user_watches=524288

reboot

cat /proc/sys/fs/inotify/max_user_watches

524288

How to fix favicon error in Visual Studio Code?

GET http://127.0.0.1:5500/favicon.ico 404 Not Found

Failed to load resource: the server responded with a status of 404 (Not Found) favicon.ico

<link rel="shortcut icon" href="#" />

Visual Studio Code HTML Emmet Abbreviations

! // HTML page template

ul#nav // ul id="nav"

(li>a)*4

.class*3 // 3 div with class="class"

h1{FlexBox}+(section#Id>h2{Properties of the .. flex Container}+.flexbox-container>(.flexbox-item)*6)*2

Ctrl+Alt+ ↑ / ↓, Esc

Ctrl + D, D, D, D...

Ctrl + Shift + E

Ctrl + P

Ctrl + ,