Less IntelliSense / SCSS IntelliSense (auto completion for variables and mixins).IntelliSense for CSS class names (CSS class auto completion for HTML files).npm IntelliSense (auto completion for installed npm packages).Path IntelliSense (auto completion for paths in your project, great for relative module imports).Here are my favorite IntelliSense extensions: VS Code’s IntelliSense engine can be pimped with extensions, too, to provide additional auto completions, definition lookups and more. Generally it makes sense to integrate the same linters in your editor that are being used within the build pipeline - this way you keep those tools in sync and profit from direct feedback within the editor: errors will be showing up inline, inside the Problems panel and affected files will be highlighted in the filetree. ESLint is the most common linting tool for JavaScript but you can even go beyond that, e.g.

Linters are a great way to check your code statically and find errors before you run into them during runtime. Also, all shortcuts are indicated for Mac OS and might slightly vary for other operating systems.

I mostly embedded links to the relevant setup guides though anyway. It improved my workflow a lot and I want to share the most helpful ones with you - hopefully you’ll find them useful, too.Īnd if you’re completely new to VS Code, you might additionally want to check the (very concise) official docs. I’m honestly super-impressed by the speed of development and look forward to each month’s feature-packed release.Īfter my switch from Atom to VS Code a few years ago, I learned about many useful customizations and extensions. Being a web developer nowadays can be lots of fun thanks to powerful and affordable (mostly free!) tools. Visual Studio Code (VS Code) is one of these tools and places itself among the most popular code editors with many developers using it and contributing to its development.

Compare atom vs visual studio code