1. The plug-in

  1. Setting Sync synchronizes all vscode plug-ins
  2. KoroFileHeader automatically generates annotations

Head note

Shortcut keys: Window: CTRL + Alt + I, MAC: CTRL + CMD + I

Methods note

Shortcut keys: Window: CTRL + Alt + T, MAC: CTRL + CMD + T

1.1 Offline Installation vSIX

1. Visit marketplace.visualstudio.com/vscode 2 application market. Search for Vue VSCode Snippets 3. Click on the right Resources -> Download Extension to Download vSIX file 4. Import the VSIX file by clicking install from VSIX in vscode

2. Common commands

# shortcuts
Open the command line
Ctrl+Shift+P
MAC: #
command+Shift+P 
# Implement simultaneous entry to multiple placesMAC long press Alt mouse click to select multiple input range and input# check the current installed address- MAC: ~/.vscode/extensions - Linux: ~/.vscode/extensionsDisplay a list of installed items
- code --list-extensions
# import plugin
- code --install-extension ms-vscode.cpptools
# delete plugin
- code --uninstall-extension ms-vscode.csharp

- code --disable-extensions
Copy the code

2.1 Quick wrapping of HTML external tags

  <div>
    404 Not Found!
  </div>
Copy the code

If you want to wrap
on the outside

  • 1.command+Shift+P
  • 2. Enter wrap and press Enter
  • 3. The input template
<! Results - - - >
<template>
  <div>
    404 Not Found!
  </div>
</template>  
Copy the code

2.2 fast HTML entry by vscode

<! Div >span
  <div>
   <span></span>
  </div>
  
  <! -- Style div. Cur
  <div class="cur">
  </div>
Copy the code

2.3 vue vscode snippets for quick entry

 vtemplate
 vdata
 vmethod
 
Copy the code

2.4 Customize the FORI shortcut template

Toolbar > Files > Preferences > User Snippets open the configuration file javascript.json

"Print out fori": {
        "prefix": "fori"."body": [
            "for (let i = 0; i < $1; i++) {"."$2 $0"."}"]."description": "Output Loop 'fori'"
    },
    "Print out forj": {
        "prefix": "forj"."body": [
            "for (let j = 0; j < $1; j++) {"."$2 $0"."}"]."description": "Output Loop 'forj'"
    }
Copy the code

2.5 Configuring import@path Prompt and Code Suggestion

1Install the plug-in: Path Intellisense2, configuration:"path-intellisense.mappings": {
        "@": "${workspaceRoot}/src"
    }
3Jsconfig. json: {"compilerOptions": {
        "target": "ES6"."module": "commonjs"."allowSyntheticDefaultImports": true."baseUrl": ". /"."paths": {
          "@ / *": ["src/*"]}},"exclude": [
        "node_modules"]}Copy the code

2.6 VScode uses the Setting Sync plug-in

1. Log in to Git to synchronize information

Check the gist

2. Download: Shift + Alt + D (on macOS: Shift + Option + U/Shift + Option + D)