1.ESLint

• 作用：代码检测
• 快捷键：
• 配置：
• 示例：

2.Prettier - Code formater

• 作用：代码格式化， 针对ESLint检测，自动格式化
• 快捷键：command + S
• 配置：
• 示例：

3.ES7 React/Redux/GraphQL/React-Native snippets

• 作用：常见代码块
• 快捷键：
• 配置：
• 代码块：

4.koroFileHeader

• 作用：注释
• 快捷键：
  *类注释：command + control + i
  *函数注释：command + control + t
• 配置：插件配置

"fileheader.customMade":{
  "Description":"",
  "Author":"姓名",
  "Date":"Do not edit",
  "LastEditTime":"Do not Edit",
  "LastEditors":"姓名"
}
"fileheader.cursorMode":{
  "description":"",
  "param":"none",
  "return":"none"
}
"fileheader.configObj":{
  "autoAdd":true,
  "autoAlready":true
}

• 示例：

TinyPNG

• 作用：图片压缩
• 快捷键：
• 配置：插件配置 或 性能优化

"tinypng.forceOverwrite":true,
"tinypng.apiKey":"8RTYhHqQg5F48wgSLf9jM7LN9crXDPQv",

• 示例：

  
  TinyPNG

推荐插件

1. Bracket Pair Colorizer

• 作用：括号颜色成对匹配

2. Import Cost

• 作用：计算导入库的大小

3. TODO Highlight

• 作用： 代办事项高亮提示
• 快捷键：command + S

插件配置位置
Settings

配置

{
  "editor.wordWrap": "on",
  "prettier.useTabs": true,
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  }
}