My visual studio code settings with some cool 2019 extensions

April 21, 2019 - In Programming

Here is a list of some cool 2019 Visual Studio Code extensions that I personally love.

I also shared my editor settings, they can help you write faster and cleaner code.

If you know other awesome extensions let me know. Enjoy!

JavaScript Extensions

Babel ES6/ES7

Adds JS Babel es6/es7 syntax coloring

babeles6es7

css2react

Convert the current selection between CSS and React’s inline style
syntax.

ES7 React/Redux/GraphQL/React-Native snippets

Simple extensions for React, Redux and Graphql in JS/TS with ES7 syntax

ESLint

Integrates ESLint JavaScript into VS Code.

Import Cost

Display import/require package size in the editor

import-cost

React Pure To Class

Convert pure react components to class components

Prettier – Code formatter

VS Code plugin for prettier/prettier

HTML Extensions

Highlight Matching Tag

Highlights matching closing or opening tag

highlightmatchtag

Live Server

Launch a development local Server with live reload feature for static &
dynamic pages

Utilities Extensions

Bookmarks

Mark lines and jump to them

bookmarks-toggle

Bracket Pair Colorizer

A customizable extension for colorizing matching brackets

bracketpaircolorizer

Code Runner

Run code snippet or code file for multiple languages

File Utils

A convenient way of creating, duplicating, moving, renaming and deleting
files and directories.

fileutils

GitLens — Git supercharged

A convenient way of creating, duplicating, moving, renaming and deleting
files and directories.

gitlens

indent-rainbow

Makes indentation easier to read

indentrainbow

WakaTime

Metrics, insights, and time tracking automatically generated from your
programming activity.

wakatime

VSCode Great Icons

A big pack of icons (100+) for your files.

vscodeicons

Version Lens

Shows the latest version for each package using code lens

versionlens

jumpy

Jumpy provides fast cursor movement, inspired by Atom’s package of the
same name.

jumpy

Theme

Dark++ Italic

Enhanced VScode Dark+ theme with support for Fira Code iScript and Fira
Code + Operator Mono fonts.

darkplusplus

Settings

{
      // show snippet suggestions on top of others
      "editor.snippetSuggestions": "top",
      // disable format on paste
      "editor.formatOnPaste": false,
      // awesome free monospaced font https://github.com/tonsky/FiraCode
      "editor.fontFamily": "Fira Code",
      "terminal.integrated.fontFamily": "Fira Code",
      // semicolon at the end of the line 
      "prettier.semi": false,
      // enable html emmet inside javascript files 
      "emmet.includeLanguages": {
        "javascript": "html"
      },
      "editor.formatOnSave": true,
      "editor.fontLigatures": true,
      // hide minimap
      "editor.minimap.enabled": false,
      "explorer.openEditors.visible": 5,
      "editor.cursorWidth": 3,
      "editor.quickSuggestionsDelay": 0,
      "workbench.statusBar.feedback.visible": false,
      "breadcrumbs.enabled": true
    }