Skip to main content

VSCode

code.visualstudio.com

github.com/Microsoft/vscode

Diff​

code --diff file1 file2

Shortcuts​

Word wrap: Alt+Z (⌥+Z). source

Code Snippets​

https://code.visualstudio.com/docs/editing/userdefinedsnippets

https://stackoverflow.com/questions/29995863/how-to-add-custom-code-snippets-in-vscode

To create a snipped, type Shift+Cmd+P and type "snippets". Select "Snippets: Configure Snippets", and then select a language (eg Markdown) from the list.

By default you need to do Ctrl+Space to trigger it, and then return/tab to expand! You can enable tab completion, which expands the snippet automatically, with "editor.tabCompletion": "on" or "editor.tabCompletion": "onlySnippets".

Extension - https://marketplace.visualstudio.com/items?itemName=wenfangdu.snippet-generator

Examples:

markdown.json
{
  // Place your snippets for markdown here. Each snippet is defined under a snippet name and has a prefix, body and
  // description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
  // $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
  // same ids are connected.
  // Example:
  // "Print to console": {
  //   "prefix": "log",
  //   "body": [
  //     "console.log('$1');",
  //     "$2"
  //   ],
  //   "description": "Log output to console"
  // }
  "Code block": {
    "prefix": "cb",
    "body": [
      "```$0",
      "```",
    ],
    "description": "Code block in markdown"
  },
  "Shell code block": {
    "prefix": "she",
    "body": [
      "```shell",
      "$0",
      "```",
    ],
    "description": "Shell code block in markdown"
  }
}
javascript.json
{
  "React component": {
    "prefix": ["rc"],
    "body": [
      "import React from 'react'",
      "",
      "export default function $1($2) {",
      "  return $0",
      "}"
    ],
    "description": "A React component"
  }
}

See more React examples in these extensions:

Settings​

Open settings.json file: Cmd+Shift+P and pick 'Open User Settings (JSON)' source

Explorer: avoid automatically revealing a file in the when we open it: Features → Explorer → Auto Reveal false.

Remove 'U'/'M' from the file tab: Workbench → Editor → Decorations: Badges, uncheck it.

Extensions​

Code Spell Checker: https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker You need to install the Catalan language.