VSCode高效好用的插件

445 阅读1分钟

美化插件

Chinese

中文汉化

vscode-icons

左侧文件目录美化

代码格式规范

ESLint

代码质量校验插件

Prettier - Code formatter

代码风格标准插件

vscode 配置

// vscode settings.json
{
  "editor.tabSize": 2,
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true,
    "source.organizeImports": true
  },
   "eslint.validate": [
    "javascript",
    "javascriptreact",
    "vue",
    "typescript",
    "typescriptreact"
  ],
}

Jest

单元测试框架

Git 插件(二选一)

GitLens (个人在用)

查看git历史提交记录,代码修改日志,比如:commit 记录

Git History 和 Git History Diff

功能基本同上

snippets 代码片段

JavaScript (ES6) code snippets

ES7+ React/Redux/React-Native snippets

project-tpl

egg.js常用代码片段

其它优秀插件

Import Cost

显示导入文件大小

Color Picker

css文件 颜色值 可视化

vscode-color-picker

js 代码 里字符串 颜色值可视化

Json to TS

快速生成ts 约束:全选 json => 然后快捷键 Shift + Ctrl + Alt + S

Auto Rename Tag 和 Highlight Matching Tag

html 元素优化体验插件

Tabnine AI Autocomplete

Ai 输入提醒

Markdown Preview Enhanced

md预览插件

Image preview

预览图片

Live Server

启动服务