VSCode configuration

1)

Download VSCode from official site http://code.visualstudio.com/

2)

Screen Shot 2016-11-12 at 9.22.16 PM.png

cmd+shift+p then install codecommand

3) Extensions

Because i’ve used atom since April, Install Atom Keymap.

To more powerful javascript development, Install(
  Babel ES6/ES7,
Complelete Statement,
ESLint,
Reactjs code snippets,
Trailling Spaces,
vscode-flow,
);

Bookmarks  for bookmarking.

Dracula Syntax Theme for syntax highlighting,

erb for erb support,

4) Configure Theme

Screen Shot 2016-11-12 at 9.29.47 PM.png

Color Theme => Dracula

File Icon Theme => Seti

5) settings.json

// Place your settings in this file to overwrite the default settings
{
    "editor.fontSize": 16,
    "editor.rulers": [100, 120],
    "editor.tabSize": 2,
    "eslint.nodePath": "/usr/local/bin/node",

    //disable default javascript validator replaced by eslint
    "javascript.validate.enable" : false,

    "terminal.integrated.fontFamily": "Source Code Pro for Powerline",

    "trailing-spaces.trimOnSave": true
  }

6) keybindings.json

[
  { "key": "ctrl+;",                 "command": "extension.complete-statement",
                                     "when": "editorTextFocus" },

  // override keymappings with atom's
  { "key": "shift+cmd+[",           "command": "workbench.action.previousEditor" },
  { "key": "shift+cmd+]",           "command": "workbench.action.nextEditor" },
  { "key": "alt+cmd+left",          "command": "editor.fold",
                                     "when": "editorTextFocus" },
  { "key": "alt+cmd+right",         "command": "editor.unfold",
                                     "when": "editorTextFocus" },

  { "key": "shift+cmd+h",           "command": "editor.action.selectHighlights",
                                     "when": "editorFocus" },
  { "key": "shift+cmd+l",            "command": "editor.action.insertCursorAtEndOfEachLineSelected",
                                     "when": "editorTextFocus" },

  { "key": "cmd+\\",               "command": "workbench.action.toggleSidebarVisibility" },
  { "key": "ctrl+\\",                "command": "workbench.action.splitEditor" },

  // somehow, ver 1.2.0 override this keybiding as zoom out
  { "key": "cmd+/",                 "command": "editor.action.commentLine",
                                     "when": "editorTextFocus && !editorReadonly" }
]

There are some missing keyboard shortcuts in Atom Keymap, Add some.

 

2 thoughts on “VSCode configuration”

Leave a Reply