vscode配置相关

基础配置，待完善

介绍

/*格式化文件对应插件：
主要是两步，一步是用格式化插件格式化对应的文件；
另一步让格式化后的代码能通过代码检验工具。
prettyhtml格式化HTML；prettier格式化css/less/scss/postcss/ts；
stylus-supremacy格式化stylus；
vscode自带格式化插件格式化js；
vetur格式化.vue文件；
ESlint进行代码检验。
*/

/*格式化思路和注意事项。
注意格式化的代码能符合ESlint代码检验。
1.用vetur设置默认格式化工具。格式化.vue文件
2.用ESlint设置保存时修复ESlint错误的功能。
3.用prettier格式化css；去除语法结尾的分号，使用单引号替换双引号。
4.保存时自动格式化。
*/

最简单格式化方法，防止设置过多，导致ESlint报错。

 "vetur.format.defaultFormatter.js": "prettier-eslint",
      "vetur.format.defaultFormatterOptions": {
          "prettier": {
              "semi": false, //  不要分号
              "singleQuote": true //  要单引号
          }
      },
      // #每次保存的时候自动格式化
      "editor.formatOnSave": true,
      "window.zoomLevel": 0,//设置vscode的字体大小和界面缩放。

基础配置1

{
  "workbench.colorTheme": "One Dark Pro",
  "editor.fontSize": 14,
  // 默认使用prettier格式化支持的文件
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  // vscode默认启用了根据文件类型自动设置tabsize的选项
  "editor.detectIndentation": false,
  // 重新设定tabsize
  "editor.tabSize": 2,
  // 保存时自动格式化代码
  "editor.formatOnSave": true,
  // eslint配置项，保存时自动修复错误。
  "editor.codeActionsOnSave": {
    "source.fixAll": true
  },

  "vetur.format.defaultFormatter.html": "prettyhtml",
  "vetur.format.defaultFormatter.css": "prettier",
  "vetur.format.defaultFormatter.postcss": "prettier",
  "vetur.format.defaultFormatter.scss": "prettier",
  "vetur.format.defaultFormatter.less": "prettier",
  "vetur.format.defaultFormatter.stylus": "stylus-supremacy",
  // "vetur.format.defaultFormatter.js": "prettier",
  "vetur.format.defaultFormatter.ts": "prettier",
  "vetur.format.defaultFormatter.sass": "sass-formatter",
  "open-in-browser.default": "Chrome",

  // 将vetur的js格式化工具指定为vscode自带的
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  // 移除js语句的分号
  "javascript.format.semicolons": "remove",
  // 在函数名后面加上括号，类似这种形式 foo () {}
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,

  // 指定 *.vue 文件的格式化工具为vetur
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  // 指定 *.js 文件的格式化工具为vscode自带
  "[javascript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },

  "vetur.format.defaultFormatterOptions": {
    "JS-beautify-HTML": {
      //  JS-beautify-HTML的设置在这里
      "wrap_attributes": "force-aligned"
    },
    "prettyhtml": {
      "printWidth'": 100, //  每一行不超过100个字符
      "singleQuote": false, //  不用单引号
      "wrapAttributes": false,
      "sortAttributes": true
    },
    "prettier": {
      //  去掉代码结尾的分号
      "semi": false, //不加分号
      "singleQuote": true, //用单引号
      // #让prettier使用eslint的代码格式进行校验
      "eslintIntegration": true,
      "arrowParens": "always"
    }
  }
}

基础配置2

{
    "workbench.colorTheme": "One Dark Pro",
    // "editor.fontFamily": "Source Code Pro, 'Source Code Pro'",
    "editor.fontSize": 14,
    "editor.tabSize ": 4,
    "workbench.editor.enablePreview": false,
    "editor.wordWrap": "on",
    "editor.quickSuggestions": {
        "strings": true
    },
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "html",
        { "language": "vue", "autoFix": true }
    ],
    "eslint.options": {
        "plugins": ["vue"]
    },
    "eslint.autoFixOnSave": true,
    "vetur.format.defaultFormatter.html": "none",
    "vetur.format.defaultFormatter.js": "none"
}

常用插件安装：

Chinese
--汉化

IntelliJ IDEA Keybindings
--使用webstorm快捷键

vue-helper
--vue函数跳转必备

HTML Boilerplate
--生成html文件

Auto Close Tag
--自动闭合HTML/XML标签

Auto Rename Tag
--自动完成另一侧标签的同步修改

Bracket Pair Colorizer
--括号不同颜色

HTML CSS Support (必备)
--智能提示CSS类名以及id 

HTML Snippets
--智能提示HTML标签，以及标签含义

CSS Peek
--追踪css类名和id定义位置

JavaScript(ES6) code snippets 
--ES6语法智能提示

Debugger for Chrome
--映射vscode上的断点到chrome上，方便调试
调试方法：https://blog.csdn.net/example440982/article/details/79587704

ESLint
--js语法纠错

Prettier
--文档格式化

GitLens(使用git的必备)
--方便查看git日志，git重度使用者必备


open in browser
--鼠标右键快速在浏览器中打开html文件

Path Intellisense
--自动提示文件路径，支持各种快速引入文件

Vetur (vue必备)
--Vue多功能集成插件

React/Redux/react-router Snippets (react必备)
--React/Redux/react-router语法智能提示

git推荐清单：https://github.com/varHarrie/varharrie.github.io/issues/10