1. 前端插件

Auto Close Tag (自动闭合标签)

Auto Rename Tag (标签自动重命名)

Better Comments (通过使用警告、信息、TODO等注释来改进代码注释 )

Bracket Pair Colorizer (让括号拥有独立的颜色，易于区分 )

Code Runner (代码块运行环境)

Code Spell Checker (英文拼写检查)

CSS Peek (快速查看定位CSS定义 )

Document This (注释模板)

ESLint (ESlint 接管原生 js 提示，可以自定制提示规则。 )

GBKtoUTF8 (编码转换插件)

Git History (git 历史代码对比)

GitLens — Git supercharged (丰富的 git 日志插件 )

HTML CSS Support (HTML CSS 智能提示)

Live Server (为静态和动态页面启动带有实时重新加载功能的开发本地服务器，非常使用)

Path Intellisense (比较基础的路径补全，path 榜一)

Path Autocomplete (更好的路径补全，支持根路径文件补全)

Polacode (帮你制作好看的代码截图)

Prettier - Code formatter (代码格式化工具)

px to rem (px 转 rem)

Remote - SSH (远程服务器文件辅助插件（linux服务器必备）)

Remote - SSH: Editing Configuration Files (远程服务器文件辅助插件（linux服务器必备）)

Remote - SSH: Explorer (远程服务器文件辅助插件（linux服务器必备）)

Settings Sync (VS Code设置同步，神插件！！！一键从远程同步配置，再也不怕换电脑了！！)

Terminal (右键添加命令行快捷工具)

Vetur (Vue语法提示)

vscode-icons (vscode 资源树目录图标)

koroFileHeader (文件头注释配置及函数注释！！中文文档相当详细 NB plus ！！)

Vue 2 Snippets (Vue代码段提示)

vscode-drawio (画图插件)

Project Manager (项目管理切换插件)

console-helper（日志小助手）

indent-rainbow（代码对齐缩进提示）

markdown-formatter (Markdown 格式化插件)

2. 主题美化插件

• 🌟 WebStorm New UI Theme
• 🌟 Bluloco Dark Theme
• Bearded Theme
• Ayu
• Cosmic Theme
• Bearded Theme（一个大合集）
• Sublime Material Theme
• Moegi Theme
• Jetbrains Fleet Theme
• Cobalt2 Theme Official

3. 字体推荐

• Monaco https://github.com/todylu/monaco.ttf
• Fira Code https://github.com/tonsky/FiraCode

4. 成为开发者

VSCode插件开发全攻略配套demo

5. 快捷操作

添加代码片段： （⇧⌘P ) -> Surround With Snippet -> ....

6. settings.json

{
    // 标签栏换行
    "workbench.editor.wrapTabs": true,
}

7. keyboard shortcuts

• 「Toggle Block Comment」 块注释

8. Tips

8.1. Better Comments在 vue 文件中不生效解決方案

/Users/nowcoder/.vscode/extensions/aaron-bond.better-comments-3.0.2

switch (languageCode) {

    case "apex":
    case "javascript":
    case "javascriptreact":
    case "typescript":
    case "typescriptreact":
        this.highlightJSDoc = true;
        break;
    case "elixir":
    case "python":
    case "tcl":
        this.ignoreFirstLine = true;
        break;
    case "plaintext":
        this.isPlainText = true;
        // If highlight plaintext is enabled, this is a supported language
        this.supportedLanguage = this.contributions.highlightPlainText;
        break;
    case 'vue':
        this.setCommentFormat("//", "/*", "*/");
        break;

}

8.2. ts(2307) 找不到模块dayjs或其相应的类型声明

setting.json

{
   /**
    * 解决：找不到模块dayjs或其相应的类型声明。ts(2307)
    * 这种ts报错是项目中ts版本与vscode中的ts版本不匹配导致的;
    * 不要使用vscode的高版本ts, 使用项目中的版本. 这里需要取用工作区的ts版本
   */
  "typescript.tsdk": "\"typescript.tsdk\": \"./node_modules/typescript/lib\""
}

8.3. Saving 'index.vue': Getting code actions from ''Tailwind CSS IntelliSense', 'Vue - Official', 'ESLint', 'cursor-retrieval'' (configure)

参考：Getting code actions from ''ESLint'' # 1055

执行： Cmd + Shift + P -> Developer: Restart Extension Host 重启插件

8.4 破解 GitLens

参考 vscode gitlens 16版本免费使用pro版 - 知乎

下载 GitLens v16.0.0 版本

编辑器打开 code /Users/nc_rain/.cursor/extensions/eamodio.gitlens-16.0.0

• qn.Community
• qn.CommunityWithAccount
• qn.Pro

都替换为 qn.Enterprise

参考 vscode gitlens插件破解

下载 GitLens v15.1.0 版本

• 修改函数里面的 qn.pro 为 qn.Community
• 修改里面所有的 allowed 的键值为 true，如 allowed:i.account?.verified!==!1 改为 allowed: true
• 修改下面的 function s 函数，同理，修改里面的 allowed 为 true，qn. Pro 改为 qn. Community
• 首先是 dist/gitlens.js，先Ctrl+F查找 iY.qn.Free，然后Ctrl+H替换为 iY.qn.Pro
• 然后是 dist/browser/gitlens.js，Ctrl+F查找 eS.qn.Free，然后Ctrl+H替换为 eS.qn.Pro