├── README.md └── media ├── Errors_Warnings.gif ├── InstallExtensions.gif ├── JoinLines.gif ├── KeyboardReferenceSheet.png ├── KeyboardShortcuts.gif ├── OpenCommandPalatte.gif ├── PreviewFileIconThemes.gif ├── PreviewThemes.gif ├── QuickOpen.gif ├── ShowRecommendedExtensions.gif ├── add_cursor_current_selection.gif ├── beginning_end_file.gif ├── bracket_matching.gif ├── change_syntax.gif ├── code_folding.gif ├── code_formatting.gif ├── command_p.png ├── configure_debug.gif ├── copy_line_down.gif ├── copy_paste_mp.gif ├── create_open_file.gif ├── debug_data_inspection.gif ├── diff_review_pane.png ├── editingevolved_gutter.png ├── editingevolved_multicursor.gif ├── emmet_syntax.gif ├── extension_actions.png ├── find_all_references.gif ├── find_by_symbol.gif ├── font-ligatures-annotated.png ├── font-ligatures.png ├── git_icon.png ├── git_inline.png ├── git_side_by_side.png ├── git_stage_all.gif ├── git_stage_selected.gif ├── go_to_symbol_in_workspace.png ├── goto_definition.gif ├── group_symbols_by_kind.png ├── install_extension.gif ├── integrated_terminal.png ├── intellisense.gif ├── interactive_playground.png ├── keyboard-references.png ├── lang-based-settings.png ├── markdown-preview-sync.gif ├── more_button.png ├── move_line.gif ├── mp_copy_paste.png ├── multi_cursor.gif ├── navigate_editors.gif ├── navigate_history.gif ├── navigate_to_file.gif ├── navigate_to_line.gif ├── node_debug.gif ├── open-command-palatte.gif ├── package_json_intellisense.gif ├── peek.gif ├── preview_themes.gif ├── rename_symbol.gif ├── resolve_merge_conflicts.gif ├── select_current_line.gif ├── setup_shell-command.png ├── shrink_expand_selection.gif ├── side-by-side-install.png ├── split_editor.gif ├── status_errors_warnings.png ├── switch_branches.gif ├── task_runner.gif ├── toggle_preview.gif ├── toggle_side_bar.gif ├── trim_whitespace.gif ├── undo_cursor_position.gif ├── undo_last_commit.gif ├── uninstall_extension.gif ├── vscode-cli-commands.png ├── welcome_page.png └── zen_mode.gif /README.md: -------------------------------------------------------------------------------- 1 | # [VS Code](https://code.visualstudio.com) Tips and Tricks 2 | 3 | >**Note**: Tips and Tricks has moved to the official Visual Studio Code documentation at [code.visualstudio.com](https://code.visualstudio.com/docs/getstarted/tips-and-tricks).
4 | >The content is now at [vscode-docs](https://github.com/Microsoft/vscode-docs/blob/master/docs/getstarted/tips-and-tricks.md). Pull requests and documentation issues are still greatly appreciated. 5 | 6 | # Table of Contents 7 | 8 | 1. Basics 9 | 2. Customization 10 | 3. Extensions 11 | 4. File and folder management 12 | 5. Editing hacks 13 | 6. IntelliSense 14 | 7. Snippets 15 | 8. Git integration 16 | 9. Debugging 17 | 10. Task runner 18 | 11. Other Resources 19 | 20 | > The key bindings below may or may not be accurate with the latest build. See [here](https://code.visualstudio.com/docs/getstarted/keybindings) for the latest keyboard shortcut reference. 21 | 22 | # Basics 23 | 24 | ## Insider Version of VS Code 25 | 26 | The Visual Studio Code team uses the Insiders version to test the latest features and bug fixes of VS Code. You can use this same version by [downloading here](https://code.visualstudio.com/insiders). 27 | 28 | * For Early Adopters - Insiders has the most recent code changes and may lead to the occasional broken build. 29 | * Frequent Builds - New builds everyday with the latest bug fixes and features. 30 | * Side-by-side install - Insiders installs next to the Stable build allowing you to use either independently. 31 | 32 | ![side by side install](/media/side-by-side-install.png) 33 | 34 | ## Getting Started 35 | 36 | Open the **Welcome** page to get started with the basics of VS Code. **Help** > **Welcome**. 37 | 38 | ![welcome page](/media/welcome_page.png) 39 | 40 | Includes the **Interactive Playground**. 41 | 42 | ![interactive playground](/media/interactive_playground.png) 43 | 44 | ## Command Palette 45 | 46 | Access all available commands based on your current context. 47 | 48 | > Mac: cmd+shift+p or f1 49 | 50 | > Windows / Linux: ctrl+shift+p or f1 51 | 52 | ![command palette](/media/OpenCommandPalatte.gif) 53 | 54 | ## Reference keybindings 55 | 56 | All of the commands are in the **Command Palette** with the associated key binding (if it exists). If you forget what the key binding is use the **Command Palette** to help you out. 57 | 58 | ![keyboard references](/media/keyboard-references.png) 59 | 60 | ## Quick open 61 | 62 | Quickly open files. 63 | 64 | > Mac: cmd+p 65 | 66 | > Windows / Linux: ctrl+p 67 | 68 | ![Quick Open](/media/QuickOpen.gif) 69 | 70 | > **Tip:** Type "?" to view help suggestions. 71 | 72 | ### Navigate between recently opened files 73 | 74 | Repeat the **Quick Open** keyboard shortcut to cycle quickly between recently opened files. 75 | 76 | ### Open multiple files from Quick Open 77 | 78 | You can open multiple files from **Quick Open** by pressing the Right arrow key. This will open the currently selected file in the background and you can continue selecting files from **Quick Open**. 79 | 80 | ## CLI tool 81 | 82 | > Linux: Follow instructions [here](https://code.visualstudio.com/docs/setup/linux). 83 | 84 | > Windows: Follow instructions [here](https://code.visualstudio.com/docs/setup/windows). 85 | 86 | > Mac: see below. 87 | 88 | Open the **Command Palette** (F1) and type "shell command". Hit enter to execute **Shell Command: Install 'code' command in PATH**. 89 | 90 | ![shell command](/media/setup_shell-command.png) 91 | 92 | 93 | ```bash 94 | # open code with current directory 95 | code . 96 | 97 | # open the current directory in the most recently used code window 98 | code -r . 99 | 100 | # create a new window 101 | code -n 102 | 103 | # change the language 104 | code --locale=es 105 | 106 | # open diff editor 107 | code --diff 108 | 109 | # see help options 110 | code --help 111 | 112 | # disable all extensions 113 | code --disable-extensions . 114 | ``` 115 | 116 | ![all cli commands](/media/vscode-cli-commands.png) 117 | 118 | ## .vscode folder 119 | 120 | Workspace specific files are in `.vscode`. For example, `tasks.json` for the Task Runner and `launch.json` for the debugger. 121 | 122 | ## Status Bar decorations 123 | 124 | **Errors and Warnings** 125 | 126 | > Mac: shift+cmd+m 127 | 128 | > Windows / Linux: ctrl+shift+m 129 | 130 | Quickly jump to errors and warnings in the project. 131 | 132 | Cycle through errors with f8 or shift+f8 133 | 134 | ![errors and warnings](/media/Errors_Warnings.gif) 135 | 136 | You can filter problems by type ('errors', 'warnings') or text matching. 137 | 138 | **Change language mode** 139 | 140 | > Mac: cmd+k m 141 | 142 | > Windows / Linux: ctrl+k m 143 | 144 | ![change syntax](/media/change_syntax.gif) 145 | 146 | If you want to persist the new language mode for that file type, you can use the **Configure File Association for ...** command to associate the current file extension with an installed language. 147 | 148 | # Customization 149 | 150 | There are many things you can do to customize VS Code. 151 | 152 | * Change your theme 153 | * Change your keyboard shortcuts 154 | * Tune your settings 155 | * Add JSON validation 156 | * Create snippets 157 | * Install extensions 158 | 159 | Check out the full [documentation](https://code.visualstudio.com/docs/getstarted/settings). 160 | 161 | ## Change your theme 162 | 163 | Open the **Command Palette** and type "themes". You can install more themes from the extension Marketplace. 164 | 165 | ![Preview themes](/media/PreviewThemes.gif) 166 | 167 | Additionally, you can install and change your File Icon themes. 168 | 169 | ![File icon themes](/media/PreviewFileIconThemes.gif) 170 | 171 | ## Change your keyboard shortcuts 172 | 173 | ### Keyboard Reference Sheets 174 | 175 | Download the keyboard shortcut reference sheet for your platform ([macOS](https://go.microsoft.com/fwlink/?linkid=832143), [Windows](https://go.microsoft.com/fwlink/?linkid=832145), [Linux](https://go.microsoft.com/fwlink/?linkid=832144)). 176 | 177 | ![Keyboard Reference Sheet](/media/KeyboardReferenceSheet.png) 178 | 179 | ### Keymaps 180 | 181 | Are you used to keyboard shortcuts from another editor? You can install a Keymap extension that brings the keyboard shortcuts from your favorite editor to VS Code. Go to **Preferences** > **Keymap Extensions** to see the current list on the [Marketplace](https://marketplace.visualstudio.com/search?target=VSCode&category=Keymaps&sortBy=Downloads). Some of the more popular ones: 182 | 183 | - [Vim](https://marketplace.visualstudio.com/items?itemName=vscodevim.vim) 184 | - [Sublime Text Keymap](https://marketplace.visualstudio.com/items?itemName=ms-vscode.sublime-keybindings) 185 | - [Emacs Keymap](https://marketplace.visualstudio.com/items?itemName=hiro-sun.vscode-emacs) 186 | - [Atom Keymap](https://marketplace.visualstudio.com/items?itemName=ms-vscode.atom-keybindings) 187 | - [Eclipse Keymap](https://marketplace.visualstudio.com/items?itemName=alphabotsec.vscode-eclipse-keybindings) 188 | 189 | ### Customize your keyboard shortcuts 190 | 191 | Open the **Command Palette** and type "keyboard shortcuts." You can now add your own keybindings in the file on the right. 192 | 193 | ![customize keyboard shortcuts](/media/KeyboardShortcuts.gif) 194 | 195 | See more in [Key Bindings for Visual Studio Code](https://code.visualstudio.com/docs/getstarted/keybindings). 196 | 197 | ## Tune your settings 198 | 199 | Open `settings.json` 200 | 201 | > Mac: cmd+, 202 | 203 | > Windows / Linux: **File** > **Preferences** > **Settings** or ctrl+, 204 | 205 | *Format on paste* 206 | 207 | ```json 208 | "editor.formatOnPaste": true 209 | ``` 210 | 211 | *Change the font size* 212 | 213 | ```json 214 | "editor.fontSize": 18 215 | ``` 216 | 217 | *Change the zoom level* 218 | 219 | ```json 220 | "window.zoomLevel": 5 221 | ``` 222 | 223 | *Font ligatures* 224 | 225 | ```json 226 | "editor.fontFamily": "Fira Code", 227 | "editor.fontLigatures": true 228 | ``` 229 | 230 | > **Tip:** You will need to have a font installed that supports font ligatures. [FiraCode](https://github.com/tonsky/FiraCode) is a popular font on the VS Code team. 231 | 232 | ![font ligatures](/media/font-ligatures-annotated.png) 233 | 234 | *Auto Save* 235 | 236 | ```json 237 | "files.autoSave": "afterDelay" 238 | ``` 239 | 240 | You can also toggle Auto Save from the top-level menu with the **File** > **Auto Save**. 241 | 242 | *Format on save* 243 | 244 | ```json 245 | "editor.formatOnSave": true, 246 | ``` 247 | 248 | *Change the size of tab characters* 249 | 250 | ```json 251 | "editor.tabSize": 4 252 | ``` 253 | 254 | *Spaces or tabs* 255 | 256 | ```json 257 | "editor.insertSpaces": true 258 | ``` 259 | 260 | *Render whitespace* 261 | 262 | ```json 263 | "editor.renderWhitespace": "all" 264 | ``` 265 | 266 | *Ignore files / folders* 267 | 268 | Removes these files / folders from your editor window. 269 | 270 | ```json 271 | "files.exclude": { 272 | "somefolder/": true, 273 | "somefile": true 274 | } 275 | ``` 276 | 277 | Remove these files / folders from search results. 278 | 279 | ```json 280 | "search.exclude": { 281 | "someFolder/": true, 282 | "somefile": true 283 | } 284 | ``` 285 | 286 | And many, many [others](https://code.visualstudio.com/docs/getstarted/settings). 287 | 288 | ## Language specific settings 289 | 290 | For those settings you only want for specific languages. 291 | 292 | ```json 293 | "[languageid]": { 294 | 295 | } 296 | ``` 297 | 298 | > **Tip:** You can find the language ID by typing in the **Command Palette** "Configure language specific settings" 299 | 300 | ![language based settings](/media/lang-based-settings.png) 301 | 302 | ## Add JSON Validation 303 | 304 | Enabled by default for many files. Create your own schema and validation in `settings.json` 305 | 306 | ```json 307 | "json.schemas": [ 308 | { 309 | "fileMatch": [ 310 | "/bower.json" 311 | ], 312 | "url": "http://json.schemastore.org/bower" 313 | } 314 | ] 315 | ``` 316 | 317 | or for a schema defined in your workspace 318 | 319 | ```json 320 | "json.schemas": [ 321 | { 322 | "fileMatch": [ 323 | "/foo.json" 324 | ], 325 | "url": "./myschema.json" 326 | } 327 | ] 328 | ``` 329 | 330 | or a custom schema 331 | 332 | ```json 333 | "json.schemas": [ 334 | { 335 | "fileMatch": [ 336 | "/.myconfig" 337 | ], 338 | "schema": { 339 | "type": "object", 340 | "properties": { 341 | "name" : { 342 | "type": "string", 343 | "description": "The name of the entry" 344 | } 345 | } 346 | } 347 | }, 348 | ``` 349 | 350 | See more in the [documentation](https://code.visualstudio.com/docs/languages/json). 351 | 352 | # Extensions 353 | 354 | ## Find extensions 355 | 356 | 1. In the VS Code [Marketplace](https://marketplace.visualstudio.com/vscode). 357 | 2. Search inside VS Code 358 | 3. View extension recommendations 359 | 4. Community curated extension lists, such as [awesome-vscode](https://github.com/viatsko/awesome-vscode) 360 | 361 | ## Install extensions 362 | 363 | Click the Extensions Activity Bar button. You can search via the search bar or click the **More** (...) button to filter and sort by install count. 364 | 365 | ![install extensions](/media/InstallExtensions.gif) 366 | 367 | ## Extension recommendations 368 | 369 | Click the Extensions Activity Bar button. Then click **Show Recommended Extensions** in the **More** (...) button menu. 370 | 371 | ![show recommended extensions](/media/ShowRecommendedExtensions.gif) 372 | 373 | ## Creating my own extension 374 | 375 | Are you interested in creating your own extension? You can learn how to do this in the documentation, specifically check out the [documentation on contribution points](https://code.visualstudio.com/docs/extensionAPI/extension-points). A simple "Hello, world" tutorial can be found [here](https://code.visualstudio.com/docs/extensions/example-hello-world). 376 | 377 | * configuration 378 | * commands 379 | * keybindings 380 | * languages 381 | * debuggers 382 | * grammars 383 | * themes 384 | * snippets 385 | * jsonValidation 386 | 387 | # File and folder management 388 | 389 | ## Integrated terminal 390 | 391 | > Windows / Linux / Mac: ctrl+` 392 | 393 | ![Integrated terminal](/media/integrated_terminal.png) 394 | 395 | Further reading: 396 | 397 | - [Official documentation](https://code.visualstudio.com/docs/editor/integrated-terminal) 398 | - [Mastering VS Code's Terminal article](http://www.growingwiththeweb.com/2017/03/mastering-vscodes-terminal.html) 399 | 400 | 401 | ## Auto Save 402 | 403 | Open `settings.json` with cmd+, 404 | 405 | ```json 406 | "files.autoSave": "afterDelay" 407 | ``` 408 | 409 | You can also toggle Auto Save from the top-level menu with the **File** > **Auto Save**. 410 | 411 | ## Toggle Sidebar 412 | 413 | > Mac: cmd+b 414 | 415 | > Windows / Linux: ctrl+b 416 | 417 | ![toggle side bar](/media/toggle_side_bar.gif) 418 | 419 | ## Zen Mode 420 | 421 | > Mac: cmd+k z 422 | 423 | > Windows / Linux: ctrl+k z 424 | 425 | ![zen mode](/media/zen_mode.gif) 426 | 427 | Enter distraction free Zen mode. 428 | 429 | ## Side by side editing 430 | 431 | > Mac: cmd+\\ or cmd then click a file from the File Explorer. 432 | 433 | > Windows / Linux: ctrl+\\ 434 | 435 | > Linux: ctrl+2 436 | 437 | ![split editors](/media/split_editor.gif) 438 | 439 | You can use drag and drop editors to create new editor groups and move editors between groups. 440 | 441 | ## Switch between editors 442 | 443 | > Mac: cmd+1, cmd+2, cmd+3 444 | 445 | > Windows / Linux: ctrl+1, ctrl+2, ctrl+3 446 | 447 | ![navigate editors](/media/navigate_editors.gif) 448 | 449 | ## Move to Explorer window 450 | 451 | > Mac: cmd+shift+e 452 | 453 | > Windows / Linux: ctrl+shift+e 454 | 455 | ## Create and open a file 456 | 457 | > Mac: cmd+click 458 | 459 | > Windows / Linux: ctrl+click 460 | 461 | ![create and open file](/media/create_open_file.gif) 462 | 463 | ## Close the currently opened folder 464 | 465 | > Mac: cmd+w 466 | 467 | > Windows / Linux: ctrl+k f 468 | 469 | ## History 470 | 471 | Navigate entire history with ctrl+tab 472 | 473 | Navigate back. 474 | 475 | > Mac: ctrl+- 476 | 477 | > Windows / Linux: alt+left 478 | 479 | Navigate Forward. 480 | 481 | > Mac: ctrl+shift+- 482 | 483 | > Windows / Linux: alt+right 484 | 485 | ![navigate history](/media/navigate_history.gif) 486 | 487 | ## Navigate to a file 488 | 489 | > Mac: cmd+e or cmd+p 490 | 491 | > Windows / Linux: ctrl+e or ctrl+p 492 | 493 | ![navigate to file](/media/navigate_to_file.gif) 494 | 495 | ## File associations 496 | 497 | Create language associations for files that aren't detected accurately (for example, many config files are JSON). 498 | 499 | ```json 500 | "file.associations": { 501 | ".database": "json" 502 | } 503 | ``` 504 | 505 | # Editing hacks 506 | 507 | Here are a selection of common features for editing code. If the keyboard shortcuts aren't comfortable for you, consider installing a [Keymap extension](https://marketplace.visualstudio.com/search?target=VSCode&category=Keymaps&sortBy=Downloads) for your old editor. 508 | 509 | ## Multi cursor selection 510 | 511 | > Mac: opt+cmd+up or opt+cmd+down 512 | 513 | > Windows: ctrl+alt+up or ctrl+alt+down 514 | 515 | > Linux: alt+shift+up or alt+shift+down 516 | 517 | ![multi cursor](/media/multi_cursor.gif) 518 | 519 | ![multi cursor second example](/media/editingevolved_multicursor.gif) 520 | 521 | Add more cursors to current selection. 522 | 523 | ![add cursor to all occurrences of current selection](/media/add_cursor_current_selection.gif) 524 | 525 | ## Join line 526 | 527 | > Mac: ctrl+j 528 | 529 | > Windows / Linux: Not bound by default. Open Keyboard Shortcuts and bind `editor.action.joinLines` to a shortcut of your choice. 530 | 531 | ![Join lines](/media/JoinLines.gif) 532 | 533 | ## Copy line up / down 534 | 535 | > Mac: opt+shift+up or opt+shift+down 536 | 537 | > Windows / Linux([Issue #5363](https://github.com/Microsoft/vscode/issues/5363)): shift+alt+down or shift+alt+up 538 | 539 | ![copy line down](/media/copy_line_down.gif) 540 | 541 | ## Shrink / expand selection 542 | 543 | More in [documentation](https://code.visualstudio.com/docs/editor/editingevolved#_selection-multicursor) 544 | 545 | > Mac: ctrl+shift+cmd+left or ctrl+shift+cmd+right 546 | 547 | > Windows / Linux: shift+alt+left or shift+alt+right 548 | 549 | ![shrink expand selection](/media/shrink_expand_selection.gif) 550 | 551 | ## Go to Symbol in File 552 | 553 | > Mac: cmd+shift+o 554 | 555 | > Windows / Linux: ctrl+shift+o 556 | 557 | ![Find by symbol](/media/find_by_symbol.gif) 558 | 559 | You can group the symbols by kind by adding a colon, `@:`. 560 | 561 | ![group symbols by kind](/media/group_symbols_by_kind.png) 562 | 563 | ## Go to Symbol in Workspace 564 | 565 | > Mac: cmd+t 566 | 567 | > Windows / Linux: ctrl+t 568 | 569 | ![go to symbol in workspace](/media/go_to_symbol_in_workspace.png) 570 | 571 | ## Navigate to a specific line 572 | 573 | > Mac: ctrl+g or cmd+p, : 574 | 575 | > Windows / Linux: ctrl+g 576 | 577 | ![navigate to line](/media/navigate_to_line.gif) 578 | 579 | ## Undo cursor position 580 | 581 | > Mac: cmd+u 582 | 583 | > Windows / Linux: ctrl+u 584 | 585 | ![undo cursor position](/media/undo_cursor_position.gif) 586 | 587 | ## Move line up and down 588 | 589 | > Mac: opt+up or opt+down 590 | 591 | > Windows / Linux: alt+up or alt+down 592 | 593 | ![move line up and down](/media/move_line.gif) 594 | 595 | ## Trim trailing whitespace 596 | 597 | > Mac: cmd+k cmd+x 598 | 599 | > Windows / Linux: ctrl+k ctrl+x 600 | 601 | ![trailing whitespace](/media/trim_whitespace.gif) 602 | 603 | ## Code formatting 604 | 605 | ### Currently selected source code 606 | 607 | > Mac: cmd+k, cmd+f 608 | 609 | > Windows / Linux: ctrl+k, ctrl+f 610 | 611 | ### Whole document format 612 | 613 | > Windows / Linux: shift+alt+f 614 | 615 | ![code formatting](/media/code_formatting.gif) 616 | 617 | ## Code folding 618 | 619 | > Mac: alt+cmd+\[ and alt+cmd+\] 620 | 621 | > Windows / Linux: ctrl+shift+\[ and ctrl+shift+\] 622 | 623 | ![code folding](/media/code_folding.gif) 624 | 625 | ## Select current line 626 | 627 | > Mac: cmd+i 628 | 629 | > Windows / Linux: ctrl+i 630 | 631 | ![select current line](/media/select_current_line.gif) 632 | 633 | ## Navigate to beginning and end of file 634 | 635 | > Mac: cmd+up and cmd+down 636 | 637 | > Windows: ctrl+up and ctrl+down 638 | 639 | > Linux: ctrl+home and ctrl+end 640 | 641 | ![navigate to beginning and end of file](/media/beginning_end_file.gif) 642 | 643 | ## Open Markdown Preview 644 | 645 | In a Markdown file, use 646 | 647 | > Mac: shift+cmd+v 648 | 649 | > Windows / Linux: ctrl+shift+v 650 | 651 | ![toggle readme preview](/media/toggle_preview.gif) 652 | 653 | ## Side by Side Markdown Edit and Preview 654 | 655 | In a Markdown file, use 656 | 657 | > Mac: cmd+k v 658 | 659 | > Windows / Linux: ctrl+k v 660 | 661 | Special bonus: The preview will now sync. 662 | 663 | ![markdown sync](/media/markdown-preview-sync.gif) 664 | 665 | # IntelliSense 666 | 667 | Anytime, try ctrl+space to trigger the Suggestions widget. 668 | 669 | ![intellisense](/media/intellisense.gif) 670 | 671 | You can view available methods, parameter hints, short documentation, etc. 672 | 673 | ## Peek 674 | 675 | Select a symbol then type alt+f12. Alternatively, you can use the context menu. 676 | 677 | ![peek](/media/peek.gif) 678 | 679 | ## Go to Definition 680 | 681 | Select a symbol then type f12. Alternatively, you can use the context menu or ctrl+click (cmd+click on macOS). 682 | 683 | ![go to definition](/media/goto_definition.gif) 684 | 685 | You can go back to your previous location with the **Go** > **Back** command or alt+left (ctrl+- on macOS). 686 | 687 | ## Find All References 688 | 689 | Select a symbol then type shift+f12. Alternatively, you can use the context menu. 690 | 691 | ![find all references](/media/find_all_references.gif) 692 | 693 | ## Rename Symbol 694 | 695 | Select a symbol then type f2. Alternatively, you can use the context menu. 696 | 697 | ![rename symbol](/media/rename_symbol.gif) 698 | 699 | ## .eslintrc.json 700 | 701 | Install the [ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint). Configure 702 | your linter however you'd like. Specification is [here](http://eslint.org/docs/user-guide/configuring). 703 | 704 | Here is configuration to use ES6. 705 | 706 | ```json 707 | { 708 | "env": { 709 | "browser": true, 710 | "commonjs": true, 711 | "es6": true, 712 | "node": true 713 | }, 714 | "parserOptions": { 715 | "ecmaVersion": 6, 716 | "sourceType": "module", 717 | "ecmaFeatures": { 718 | "jsx": true, 719 | "classes": true, 720 | "defaultParams": true 721 | } 722 | }, 723 | "rules": { 724 | "no-const-assign": 1, 725 | "no-extra-semi": 0, 726 | "semi": 0, 727 | "no-fallthrough": 0, 728 | "no-empty": 0, 729 | "no-mixed-spaces-and-tabs": 0, 730 | "no-redeclare": 0, 731 | "no-this-before-super": 1, 732 | "no-undef": 1, 733 | "no-unreachable": 1, 734 | "no-use-before-define": 0, 735 | "constructor-super": 1, 736 | "curly": 0, 737 | "eqeqeq": 0, 738 | "func-names": 0, 739 | "valid-typeof": 1 740 | } 741 | } 742 | ``` 743 | 744 | ## package.json 745 | 746 | See IntelliSense for your `package.json` file. 747 | 748 | ![package json intellisense](/media/package_json_intellisense.gif) 749 | 750 | ## Emmet syntax 751 | 752 | [Support for Emmet syntax](https://code.visualstudio.com/docs/languages/html#_emmet-snippets). 753 | 754 | ![emmet syntax](/media/emmet_syntax.gif) 755 | 756 | # Snippets 757 | 758 | ## Create custom snippets 759 | 760 | **File** > **Preferences** > **User Snippets**, select the language, and create a snippet. 761 | 762 | ```json 763 | "create component": { 764 | "prefix": "component", 765 | "body": [ 766 | "class $1 extends React.Component {", 767 | "", 768 | " render() {", 769 | " return ($2);", 770 | " }", 771 | "", 772 | "}" 773 | ] 774 | }, 775 | ``` 776 | 777 | See more details in [Creating your own Snippets](https://code.visualstudio.com/docs/editor/userdefinedsnippets). 778 | 779 | # Git Integration 780 | 781 | Git integration comes with VS Code "in-the-box". You can install other SCM provider from the extension Marketplace. This section describes the Git integration but much of the UI and gestures are shared by other SCM providers. 782 | 783 | ## Diffs 784 | 785 | Click the Source Control button in the Activity Bar then select the file to diff. 786 | 787 | ![git icon](/media/git_icon.png) 788 | 789 | **Side by side** 790 | 791 | Default is side by side diff. 792 | 793 | ![git diff side by side](/media/git_side_by_side.png) 794 | 795 | **Inline view** 796 | 797 | Toggle inline view by clicking the **More** (...) button in the top right and selecting **Switch to Inline View**. 798 | 799 | ![more git button](/media/more_button.png) 800 | 801 | ![git inline](/media/git_inline.png) 802 | 803 | If you prefer the inline view, you can set `"diffEditor.renderSideBySide": false`. 804 | 805 | 806 | **Review Pane** 807 | 808 | Navigate through diffs with `F7` and `Shift+F7`. This will present them in a unified patch format. 809 | Lines can be navigated with arrow keys and pressing `Enter` will jump back in the diff editor and the selected line. 810 | 811 | ![diff_review_pane](/media/diff_review_pane.png) 812 | 813 | 814 | **Edit pending changes** 815 | 816 | You can make edits directly in the pending changes of the diff view. 817 | 818 | 819 | ## Branches 820 | 821 | Easily switch between Git branches via the Status Bar. 822 | 823 | ![switch branches](/media/switch_branches.gif) 824 | 825 | ## Staging 826 | 827 | **Stage all** 828 | 829 | Hover over the number of files and click the plus button. 830 | 831 | ![git stage all](/media/git_stage_all.gif) 832 | 833 | **Stage selected** 834 | 835 | Stage a portion of a file by selecting that file (using the arrows) and then choosing **Stage Selected Ranges** from the **Command Palette**. 836 | 837 | ![git stage selected](https://cloud.githubusercontent.com/assets/1926584/23407797/ebeefbb4-fdc5-11e6-8ca1-c4c6c056a8fd.png) 838 | 839 | ## Undo last commit 840 | 841 | ![undo last commit](/media/undo_last_commit.gif) 842 | 843 | ## See Git output 844 | 845 | VS Code makes it easy to see what Git commands are actually running. This is helpful when learning Git or debugging a difficult source control issue. 846 | 847 | > Mac: shift+cmd+u 848 | 849 | > Windows / Linux: ctrl+shift+u 850 | 851 | to run `toggleOutput`. Select **Git** in the drop-down. 852 | 853 | ## Gutter indicators 854 | 855 | View diff decorations in editor. See [documentation](https://code.visualstudio.com/docs/editor/versioncontrol#_gutter-indicators) for more details. 856 | 857 | ![git gutter indicators](/media/editingevolved_gutter.png) 858 | 859 | ## Resolve merge conflicts 860 | 861 | During a merge, click the Source Control button in the Activity Bar and make changes in the diff view. Select and accept current, incoming or both changes in just one click. 862 | 863 | ![git icon](/media/git_icon.png) 864 | ![resolve merge conflicts](/media/resolve_merge_conflicts.gif) 865 | 866 | ## Setup VS Code as default merge tool 867 | 868 | ```bash 869 | git config --global merge.tool code 870 | ``` 871 | ## Pull request extension 872 | 873 | Review pull requests inside vscode [vscode-pull-request-github](https://github.com/Microsoft/vscode-pull-request-github) 874 | 875 | # Debugging 876 | 877 | ## Configure debugger 878 | 879 | f1 and select **Debug: Open launch.json**, select the environment. This will generate a `launch.json` file. Works out of the box as expected for Node.js and other environments. May need some additional configuration for other languages. See [documentation](https://code.visualstudio.com/docs/editor/debugging) for more details. 880 | 881 | ![configure debugging](/media/configure_debug.gif) 882 | 883 | ## Breakpoints and stepping through 884 | 885 | Place breakpoints next to the line number. Navigate forward with the Debug widget. 886 | 887 | ![debug](/media/node_debug.gif) 888 | 889 | ## Data inspection 890 | 891 | Inspect variables in the Debug panels and in the console. 892 | 893 | ![data inspection](/media/debug_data_inspection.gif) 894 | 895 | ## Inline values 896 | 897 | You can set `"debug.inlineValues": true` to see variable values inline in the debugger. This feature is experimental and disabled by default. 898 | 899 | # Task Runner 900 | 901 | ## Auto detect tasks 902 | 903 | Select **Tasks** from the top-level menu, run the command **Configure Tasks...**, then select the type of task you'd like to run. 904 | This will generate a `tasks.json` file with content like the following. See the Tasks [documentation](https://go.microsoft.com/fwlink/?LinkId=733558) for more details. 905 | 906 | ```json 907 | { 908 | // See http://go.microsoft.com/fwlink/?LinkId=733558 909 | // for the documentation about the tasks.json format 910 | "version": "0.1.0", 911 | "command": "npm", 912 | "isShellCommand": true, 913 | "showOutput": "always", 914 | "suppressTaskName": true, 915 | "tasks": [ 916 | { 917 | "taskName": "install", 918 | "args": ["install"] 919 | }, 920 | { 921 | "taskName": "build", 922 | "args": ["run", "build"] 923 | } 924 | ] 925 | } 926 | ``` 927 | 928 | There are occasionally issues with auto generation. Check out the documentation for getting things to work properly. 929 | 930 | ## Run tasks from the Tasks menu 931 | 932 | Select **Tasks** from the top-level menu, run the command **Run Task...**, and select the task you want to run. Terminate the running task by running the command **Terminate Task...** 933 | 934 | ![task runner](/media/task_runner.gif) 935 | 936 | 937 | ## Other Resources 938 | 939 | * [vscode official docs](https://code.visualstudio.com/docs) 940 | * [react sample app](https://github.com/Microsoft/vscode-react-sample) 941 | * [awesome vscode](https://github.com/viatsko/awesome-vscode) 942 | * [vscode can do that](https://vscodecandothat.com/) 943 | -------------------------------------------------------------------------------- /media/Errors_Warnings.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/Errors_Warnings.gif -------------------------------------------------------------------------------- /media/InstallExtensions.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/InstallExtensions.gif -------------------------------------------------------------------------------- /media/JoinLines.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/JoinLines.gif -------------------------------------------------------------------------------- /media/KeyboardReferenceSheet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/KeyboardReferenceSheet.png -------------------------------------------------------------------------------- /media/KeyboardShortcuts.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/KeyboardShortcuts.gif -------------------------------------------------------------------------------- /media/OpenCommandPalatte.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/OpenCommandPalatte.gif -------------------------------------------------------------------------------- /media/PreviewFileIconThemes.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/PreviewFileIconThemes.gif -------------------------------------------------------------------------------- /media/PreviewThemes.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/PreviewThemes.gif -------------------------------------------------------------------------------- /media/QuickOpen.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/QuickOpen.gif -------------------------------------------------------------------------------- /media/ShowRecommendedExtensions.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/ShowRecommendedExtensions.gif -------------------------------------------------------------------------------- /media/add_cursor_current_selection.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/add_cursor_current_selection.gif -------------------------------------------------------------------------------- /media/beginning_end_file.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/beginning_end_file.gif -------------------------------------------------------------------------------- /media/bracket_matching.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/bracket_matching.gif -------------------------------------------------------------------------------- /media/change_syntax.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/change_syntax.gif -------------------------------------------------------------------------------- /media/code_folding.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/code_folding.gif -------------------------------------------------------------------------------- /media/code_formatting.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/code_formatting.gif -------------------------------------------------------------------------------- /media/command_p.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/command_p.png -------------------------------------------------------------------------------- /media/configure_debug.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/configure_debug.gif -------------------------------------------------------------------------------- /media/copy_line_down.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/copy_line_down.gif -------------------------------------------------------------------------------- /media/copy_paste_mp.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/copy_paste_mp.gif -------------------------------------------------------------------------------- /media/create_open_file.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/create_open_file.gif -------------------------------------------------------------------------------- /media/debug_data_inspection.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/debug_data_inspection.gif -------------------------------------------------------------------------------- /media/diff_review_pane.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/diff_review_pane.png -------------------------------------------------------------------------------- /media/editingevolved_gutter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/editingevolved_gutter.png -------------------------------------------------------------------------------- /media/editingevolved_multicursor.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/editingevolved_multicursor.gif -------------------------------------------------------------------------------- /media/emmet_syntax.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/emmet_syntax.gif -------------------------------------------------------------------------------- /media/extension_actions.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/extension_actions.png -------------------------------------------------------------------------------- /media/find_all_references.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/find_all_references.gif -------------------------------------------------------------------------------- /media/find_by_symbol.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/find_by_symbol.gif -------------------------------------------------------------------------------- /media/font-ligatures-annotated.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/font-ligatures-annotated.png -------------------------------------------------------------------------------- /media/font-ligatures.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/font-ligatures.png -------------------------------------------------------------------------------- /media/git_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/git_icon.png -------------------------------------------------------------------------------- /media/git_inline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/git_inline.png -------------------------------------------------------------------------------- /media/git_side_by_side.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/git_side_by_side.png -------------------------------------------------------------------------------- /media/git_stage_all.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/git_stage_all.gif -------------------------------------------------------------------------------- /media/git_stage_selected.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/git_stage_selected.gif -------------------------------------------------------------------------------- /media/go_to_symbol_in_workspace.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/go_to_symbol_in_workspace.png -------------------------------------------------------------------------------- /media/goto_definition.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/goto_definition.gif -------------------------------------------------------------------------------- /media/group_symbols_by_kind.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/group_symbols_by_kind.png -------------------------------------------------------------------------------- /media/install_extension.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/install_extension.gif -------------------------------------------------------------------------------- /media/integrated_terminal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/integrated_terminal.png -------------------------------------------------------------------------------- /media/intellisense.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/intellisense.gif -------------------------------------------------------------------------------- /media/interactive_playground.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/interactive_playground.png -------------------------------------------------------------------------------- /media/keyboard-references.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/keyboard-references.png -------------------------------------------------------------------------------- /media/lang-based-settings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/lang-based-settings.png -------------------------------------------------------------------------------- /media/markdown-preview-sync.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/markdown-preview-sync.gif -------------------------------------------------------------------------------- /media/more_button.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/more_button.png -------------------------------------------------------------------------------- /media/move_line.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/move_line.gif -------------------------------------------------------------------------------- /media/mp_copy_paste.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/mp_copy_paste.png -------------------------------------------------------------------------------- /media/multi_cursor.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/multi_cursor.gif -------------------------------------------------------------------------------- /media/navigate_editors.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/navigate_editors.gif -------------------------------------------------------------------------------- /media/navigate_history.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/navigate_history.gif -------------------------------------------------------------------------------- /media/navigate_to_file.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/navigate_to_file.gif -------------------------------------------------------------------------------- /media/navigate_to_line.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/navigate_to_line.gif -------------------------------------------------------------------------------- /media/node_debug.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/node_debug.gif -------------------------------------------------------------------------------- /media/open-command-palatte.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/open-command-palatte.gif -------------------------------------------------------------------------------- /media/package_json_intellisense.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/package_json_intellisense.gif -------------------------------------------------------------------------------- /media/peek.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/peek.gif -------------------------------------------------------------------------------- /media/preview_themes.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/preview_themes.gif -------------------------------------------------------------------------------- /media/rename_symbol.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/rename_symbol.gif -------------------------------------------------------------------------------- /media/resolve_merge_conflicts.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/resolve_merge_conflicts.gif -------------------------------------------------------------------------------- /media/select_current_line.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/select_current_line.gif -------------------------------------------------------------------------------- /media/setup_shell-command.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/setup_shell-command.png -------------------------------------------------------------------------------- /media/shrink_expand_selection.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/shrink_expand_selection.gif -------------------------------------------------------------------------------- /media/side-by-side-install.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/side-by-side-install.png -------------------------------------------------------------------------------- /media/split_editor.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/split_editor.gif -------------------------------------------------------------------------------- /media/status_errors_warnings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/status_errors_warnings.png -------------------------------------------------------------------------------- /media/switch_branches.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/switch_branches.gif -------------------------------------------------------------------------------- /media/task_runner.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/task_runner.gif -------------------------------------------------------------------------------- /media/toggle_preview.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/toggle_preview.gif -------------------------------------------------------------------------------- /media/toggle_side_bar.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/toggle_side_bar.gif -------------------------------------------------------------------------------- /media/trim_whitespace.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/trim_whitespace.gif -------------------------------------------------------------------------------- /media/undo_cursor_position.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/undo_cursor_position.gif -------------------------------------------------------------------------------- /media/undo_last_commit.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/undo_last_commit.gif -------------------------------------------------------------------------------- /media/uninstall_extension.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/uninstall_extension.gif -------------------------------------------------------------------------------- /media/vscode-cli-commands.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/vscode-cli-commands.png -------------------------------------------------------------------------------- /media/welcome_page.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/welcome_page.png -------------------------------------------------------------------------------- /media/zen_mode.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/microsoft/vscode-tips-and-tricks/7e4c1273d1ed9db2301dd4b3e7589272bad56ffa/media/zen_mode.gif --------------------------------------------------------------------------------