vs code 自食用记录

还是觉得webstorm强大，公司电脑又不用心疼内存，肯定是我的首选，奈何最新版破解方法都已失效，必然要拥抱vs code了。

我的插件列表

插件列表

• auto Rename Tag 用于修改html标签，修改开始标签，会自动匹配修改结束标签
• Bracket Pair Colorizer 用于对匹配的括号做颜色区分，使我们能更快的找到代码块对应的位置
• ESLint 代码检查
• GitLens 用于git代码管理
• Material Icon Theme 图标修改为material风格
• Path Intellisense 导入包的时候，可以自动提示包里所包含的模块，便于选择
• Prettier 代码格式化插件
• Vetur 支持单文件
• Vue Theme 一款我个人觉得比较舒服的主题

实用快捷键

"command" + "p" 快速搜索指定文件
"control" + "tab" 在已打开的文件之间切换
"control" + "-" (减号)/ "control" + "shift" + "-" 跳回之间光标的位置/重新回到当前位置
"command" + "shift" + "" 自动跳转到对应的结束括号

附全部快捷键：

快捷键大全

workspace 设置

.vscode 文件夹下的setting.json 保存了工作区设置
我的设置文件如下：

{
    "eslint.packageManager": "yarn",
    "eslint.run": "onSave",
    "eslint.autoFixOnSave": true,
    "eslint.validate": [
      "javascript",
      "javascriptreact",
      {
        "language": "html",
        "autoFix": true
      },
      {
        "language": "vue",
        "autoFix": true
      }
    ],
    "vetur.format.options.tabSize": 2,
    "vetur.format.options.useTabs": true,
    "vetur.format.defaultFormatter.js": "prettier",
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "vetur.format.scriptInitialIndent": true,
    "vetur.format.defaultFormatterOptions": {
      "js-beautify-html": {
        "wrap_attributes": "force-aligned",
        "end_with_newline": true
      },
      "prettier": {
        "useTabs": false,
        "tabSize": 2,
        "semi": false,
        "singleQuote": true,
        "eslintIntegration": true,
        "trailingComma": "none",
        "bracketSpacing": true,
        "proseWrap": "preserve"
      },
      "prettyhtml": {
        "tabWidth": 2,
        "useTabs": true,
        "printWidth": 100,
        "singleQuote": false
      }
    },
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    "emmet.showAbbreviationSuggestions": true,
    "emmet.showExpandedAbbreviation": "always",
    "emmet.includeLanguages": {
      "vue-html": "html",
      "vue": "html",
      "*.tpl": "html"
    },
    "emmet.triggerExpansionOnTab": true,
    "emmet.syntaxProfiles": {
      "vue-html": "html",
      "vue": "html"
    },
    "files.associations": {
      "*.tpl": "html",
      "*.vue": "vue"
    },
    "files.insertFinalNewline": true,
    "[javascript]": {
      "editor.formatOnSave": true
    },
    "html.format.indentInnerHtml": true,
    "prettier.arrowParens": "always",
    "prettier.eslintIntegration": true,
    "prettier.jsxSingleQuote": true,
    "prettier.jsxBracketSameLine": true,
    "prettier.useTabs": true,
    "prettier.tabWidth": 2,
    "prettier.bracketSpacing": true,
    "prettier.semi": false,
    "prettier.singleQuote": true,
    "prettier.trailingComma": "none",
    "files.watcherExclude": {
      "**/.git/objects/**": true,
      "**/.git/subtree-cache/**": true,
      "**/node_modules/**": true,
      "**/tmp/**": true,
      "**/bower_components/**": true
    },
    "files.exclude": {
      "**/.git": true,
      "**/.svn": true,
      "**/.hg": true,
      "**/CVS": true,
      "**/.DS_Store": true,
      "**/tmp": true,
      "**/node_modules": true,
      "**/bower_components": true
    },
    "workbench.enableExperiments": false,
    "workbench.settings.enableNaturalLanguageSearch": false,
    "better-comments.highlightPlainText": true,
    "editor.detectIndentation": false,
    "editor.tabSize": 2
  }