使用VScode开发工具必装的插件

插件名	作用
Chinese (Simplified) Language Pack	VSCode 简体中文包
open in browser	用 alt + b 能够在浏览器中查看当前页面
Live Server	代码保存，即可自动在浏览器中显示，无需重新刷新
Prettier - Code formatter	代码格式化工具
Auto Close Tag	自动帮你闭合标签
Vetur	vue文件代码高亮插件-vscode中安装
VueHelper	代码提示插件-vscode中安装
vscode-icons	显示文件图标，方便准确查找文件，美化显示
GitLens-Git supercharged	增强了Visual Studio代码中内置的Git功能。它可以帮助您通过Git注释和代码镜头一目了然地可视化代码作者身份，无缝地导航和探索Git存储库，通过强大的比较命令获得有价值的见解
koroFileHeader	用于生成文件头部注释和函数注释的插件，可以提高团队的代码规范
ESLint	帮助检查代码，规范我们写代码的格式, 看着整洁 / 团队内成员风格统一，提高代码质量

 

 

 

 

 

 

 

ESLint在VSCode中使用：

• 一定要把脚手架工程, 作为vscode根目录, 因为eslint要使用配置文件.eslintrc。
• 一定要配置插件监测的时机, 修改ESLint插件配置，边写代码, 让VSCode就提示ESLint规则，否则每次运行后, 才看到ESLint报错, 很累
•  不用管别的, 把红框的放在{}内即可

  "eslint.run": "onType",
  "editor.codeActionsOnSave": {
  	"source.fixAll.eslint": true
  }

• 随便文件里多敲击几个回车, vscode报错提示, 证明ESLint插件开始工作

• ctrl + s 报错下是否能自动修复部分问题, 可以, 证明ESLint插件开始工作

• 在.eslintrc.js文件中, 可以调整规则(团队内可以自定义自己一套)

koroFileHeader的settings.json配置

{
 //函数注释
  "fileheader.cursorMode": {
        
    "Description": "",
    "Author": "自己的名字",
    "param": "",
    "return": ""
},
// 头部注释
"fileheader.customMade": {
    "Description": "",
    "Author": "自己的名字",
    "Date": "Do not edit",
    "LastEditTime": "Do not Edit"
},
"fileheader.configObj": {
  "createFileTime": true,
  "language": {
      "languagetest": {
          "head": "/$$",
          "middle": " $ @",
          "end": " $/"
      }
  },
  "autoAdd": true,
  "autoAddLine": 100,
  "autoAlready": true,
  "annotationStr": {
      "head": "/*",
      "middle": " * @",
      "end": " */",
      "use": false
  },
  "headInsertLine": {
  "headInsertLine": {
      "php": 4,
      "sh": 4
  },
  "beforeAnnotation": {
      "文件后缀": "该文件后缀的头部注释之前添加某些内容"
  },
  "afterAnnotation": {
      "文件后缀": "该文件后缀的头部注释之后添加某些内容"
  },
  "specialOptions": {
      "特殊字段": "自定义比如LastEditTime/LastEditors"
  },
  "switch": {
      "newlineAddAnnotation": true
  },
  "supportAutoLanguage": [],
  "prohibitAutoAdd": ["json"],
  "prohibitItemAutoAdd": [
      "项目的全称, 整个项目禁止自动添加头部注释, 可以使用快捷键添加"
  ],
  "moveCursor": true,
  "dateFormat": "YYYY-MM-DD HH:mm:ss",
  "atSymbol": ["@", "@"],
  "atSymbolObj": {
      "文件后缀": ["头部注释@符号", "函数注释@符号"]
  },
  "colon": [": ", ": "],
  "colonObj": {
      "文件后缀": ["头部注释冒号", "函数注释冒号"]
  },
  "filePathColon": "路径分隔符替换",
  "showErrorMessage": false,
  "wideSame": false,
  "wideNum": 13,
  "CheckFileChange": false,
  "createHeader": true,
  "useWorker": false,
  "designAddHead": false,
  "headDesignName": "random",
  "headDesign": false,
  "cursorModeInternal": false
},
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"git.ignoreWindowsGit27Warning": true,
// 是否允许自定义的snippet片段提示
"editor.snippetSuggestions": "top",
"editor.fontWeight": "400",
"guides.enabled": false,
"git.confirmSync": false,
"editor.renderWhitespace": "boundary",
"editor.cursorBlinking": "smooth",
"editor.minimap.enabled": true,
"editor.minimap.renderCharacters": false,
"window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",
"editor.codeLens": true,
// 配置文件关联，以便启用对应的提示
"files.associations": {
  "*.vue": "vue",
  "*.wxss": "css",
  "*.cjson": "jsonc",
  "*.wxs": "javascript"
},
// 配置emmet是否启用tab展开缩写
"emmet.triggerExpansionOnTab": true,
// 配置emmet对文件类型的支持
"emmet.syntaxProfiles": {
  "javascript": "jsx",
  "vue": "html",
  "vue-html": "html"
},
// eslint配置文件
"eslint.options": {
  "extensions": [".js", ".vue"]
},
// eslint能够识别的文件后缀类型
"eslint.validate": [
  "javascript",
  "javascriptreact",
  {
      "language": "vue",
      "autoFix": true
  },
  {
      "language": "html",
      "autoFix": true
  },
  "vue",
  "html"
],
"search.exclude": {
  "**/node_modules": true,
  "**/bower_components": true,
  "**/dist": true
},
"vetur.format.defaultFormatter.html": "prettier",
// 格式化快捷键（默认）：Shift+Alt+F
// prettier进行格式化时，开启eslint支持
"prettier.eslintIntegration": false,
"prettier.tabWidth": 4,
"prettier.tabSize": 4,
"editor.tabSize": 4,
// 是否使用单引号
"prettier.singleQuote": true,
"dart.flutterSdkPath": "/Applications/flutter",
"[javascript]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"git.autofetch": true,
"emmet.includeLanguages": {
  "wxml": "html"
},
"minapp-vscode.disableAutoConfig": true,
"editor.codeActionsOnSave": {
  "source.fixAll.eslint": true
},
"editor.autoIndent": "false",
"editor.autoClosingQuotes": "always",
"javascript.format.placeOpenBraceOnNewLineForFunctions": true,
"typescript.format.placeOpenBraceOnNewLineForFunctions": true,
"C_Cpp.vcFormat.newLine.scopeBracesOnSeparateLines": true,
"javascript.format.insertSpaceAfterConstructor": true,
"vetur.format.options.tabSize": 4,
"vetur.format.options.useTabs": true,
"workbench.editor.enablePreview": true,
"[vue]": {
  "editor.defaultFormatter": "svipas.prettier-plus"
},
"[jsonc]": {
  "editor.defaultFormatter": "svipas.prettier-plus"
},
"workbench.colorTheme": "One Dark Pro",
"terminal.integrated.automationShell.windows": "",
"terminal.integrated.shellArgs.windows": ["-NoLogo"], // 方法1.忽略打印出来的 版本信息
"python.jediEnabled": false,
"terminal.integrated.shell.windows": "C:\\Windows\\System32\\WindowsPowerShell\\v1.0\\powershell.exe",
"workbench.iconTheme": "vscode-icons",
"[html]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[css]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[json]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"git.enableSmartCommit": true,
"diffEditor.ignoreTrimWhitespace": false,
"[javascriptreact]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"workbench.editor.untitled.hint": "hidden",
"vsicons.dontShowNewVersionMessage": true,
"workbench.statusBar.visible": true
}
}