A few extensions are genuinely worth it: Prettier, ESLint, GitLens, Git Graph, Error Lens, Path Intellisense. The rest is noise. This lesson gives you the short list and the case for each one.
Installing an extension
Open the Extensions panel (square icon in the sidebar, or Ctrl+Shift+X). Type the name or ID in the search bar, click Install.
You can also install from the terminal:
The 6 essential extensions
Prettier - esbenp.prettier-vscode
Automatically formats your code on every save: indentation, quotes, commas, line length. You never have to fight with a file's style again. Configure it once in .prettierrc and forget it.
ESLint - dbaeumer.vscode-eslint
Catches potential bugs before you run the code: unused variables, missing imports, common type errors. Red underlines appear in real time in the editor. Essential on any JavaScript or TypeScript project.
GitLens - eamodio.gitlens
Displays inline in the editor, in light grey, who modified each line and when (inline git blame). Hover a line: you see the commit message. Click it: you land in the full history. Essential on any team project.
Error Lens - usernamehw.errorlens
By default, VS Code shows ESLint and TypeScript errors only when you hover a line. Error Lens displays them in bold directly to the right of the faulty code, without moving your mouse. You see errors as you type.
Path Intellisense - christian-kohler.path-intellisense
Autocompletes file paths in your imports (../components/Button, ./utils/format). Type ./ and a list of files appears. Prevents typos on relative paths.
IntelliCode - visualstudioextsai.vscodeintellicode
Improves VS Code's autocomplete with suggestions based on your code context and popular open-source patterns. The most likely suggestions rise to the top of the list, prefixed with a star.