settings.json

{
  /* 编辑器配置 */

  "editor.defaultFormatter": "esbenp.prettier-vscode", // 默认格式化工具
  // "[vue]": {
  //   "editor.defaultFormatter": "Vue.volar"
  // },
  // "[css]": {
  //   "editor.defaultFormatter": "stylelint.vscode-stylelint"
  // },
  // "[html]": {
  //   "editor.defaultFormatter": "vscode.html-language-features"
  // },
  // "[typescript]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // },
  // "[javascript]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // },
  // "[json]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // },
  "editor.fontFamily": "'Fira Code'", // 编辑器字体
  "editor.fontLigatures": true, // 支持连字的字体将自动将特定的字符组合渲染为连字符号。例如，输入 !== 时会显示为一个合并的符号，增强代码的可读性和视觉效果。
  "editor.tabSize": 2, // 每个 Tab 字符在编辑器中占据的空格数
  "editor.mouseWheelZoom": false, // 用于控制是否通过按住 Ctrl 键并滚动鼠标滚轮来缩放编辑器中的字体大小
  "editor.renderWhitespace": "trailing",
  "editor.wordWrap": "on", // 是否启用自动换行
  "editor.unicodeHighlight.invisibleCharacters": true, // 用于控制是否高亮显示不可见字符，例如空格和制表符
  "editor.suggestSelection": "recentlyUsedByPrefix", // 用于控制代码建议（代码补全）窗口中默认选择的建议项。recentlyUsedByPrefix: 默认选择最近根据前缀使用过的建议项
  "editor.codeActionsOnSave": {
    // 用于在保存文件时自动执行指定的代码操作（Code Actions）
    "source.fixAll.eslint": "explicit", // 在保存文件时执行 ESLint 插件的所有自动修复操作。explicit: 保存时触发代码操作, always: 保存以及窗口或焦点改变自动保存时触发代码操作, never: 保存时不触发代码操作
    "source.fixAll.tslint": "explicit",
    "source.fixAll.stylelint": "always"
  },
  "editor.formatOnSave": true, // 保存文件时是否自动格式化代码
  "editor.suggest.snippetsPreventQuickSuggestions": true, // 此设置用于控制当代码片段建议出现时，是否应该阻止快速建议。代码片段建议是预定义的代码模板，而快速建议是根据上下文提供的代码补全建议。启用 (true): 当代码片段建议出现时，快速建议（例如变量名、函数名等）将被阻止。这意味着在输入时，如果有代码片段建议，VS Code 将只显示代码片段而不显示其他快速建议。禁用 (false): 代码片段建议和快速建议将同时显示。这样你可以同时看到代码片段和上下文相关的其他建议。
  "editor.accessibilitySupport": "auto", // 用于控制编辑器的无障碍支持功能。这对于依赖屏幕阅读器的用户特别有用。
  "editor.stickyScroll.enabled": true, // 用于启用或禁用编辑器的“粘性滚动”功能。粘性滚动功能允许在滚动代码时，将当前代码块（如函数或类）的顶部部分固定在编辑器顶部，这样你可以更清楚地看到上下文结构
  "files.eol": "\n", // 用于指定文件的行尾符
  "files.autoSave": "afterDelay", // 用于控制文件的自动保存行为
  "workbench.iconTheme": "vscode-icons",
  "workbench.colorTheme": "Material Theme Darker",
  "workbench.sideBar.location": "right", // 控制主边栏和活动栏的位置
  "terminal.integrated.fontFamily": "monospace", // 终端字体
  "workbench.startupEditor": "readme", // 用于指定在启动时打开的编辑器类型或布局
  "window.zoomLevel": 1, // 用于控制编辑器和整个界面的缩放级别
  "explorer.confirmDelete": false, // 启用此设置后，当你在文件资源管理器中删除文件或文件夹时，VS Code 会弹出一个确认对话框，询问你是否确定要删除该文件或文件夹。这可以防止误删文件或文件夹
  "terminal.integrated.env.osx": {
    // 设置环境变量，通过 process.env.NODE_ENV访问
    "NODE_ENV": "development"
  },
  "git.path": "/opt/homebrew/bin/git", // 系统中安装的 Git 工具路径
  "git.openRepositoryInParentFolders": "never", // 用于控制在打开文件夹时是否在其父文件夹中搜索 Git 仓库
  "git.autofetch": true,
  "merge-conflict.autoNavigateNextConflict.enabled": true, // 是否在解决合并冲突后自动转到下一个合并冲突
  "diffEditor.maxComputationTime": 1000,
  "diffEditor.ignoreTrimWhitespace": false,
  "diffEditor.experimental.showMoves": true,
  "debug.javascript.autoAttachFilter": "always",
  "debug.allowBreakpointsEverywhere": true, // 允许在任何文件中设置断点
  "debug.javascript.pickAndAttachOptions": {
    "autoAttachChildProcesses": true
  },
  "javascript.validate.enable": false, // 和 eslint 可能会冲突
  "javascript.updateImportsOnFileMove.enabled": "always", // 启用此设置后，当你移动或重命名 JavaScript 或 TypeScript 文件时，VS Code 会自动更新相关文件中的导入语句，以保持正确的导入路径，防止因路径错误导致的导入失败
  "css.validate": false, // 和 stylelint 可能会冲突
  "less.validate": false, // 和 stylelint 可能会冲突
  "scss.validate": false, // 和 stylelint 可能会冲突
  "html.validate.scripts": false, // 和 eslint 可能会冲突
  "typescript.suggest.paths": true, // 是否启用路径建议，编辑器将会在需要时自动提示路径
  "javascript.suggest.paths": true, // 是否启用路径建议，编辑器将会在需要时自动提示路径
  "typescript.updateImportsOnFileMove.enabled": "always",
  "js/ts.implicitProjectConfig.experimentalDecorators": true, // 允许使用装饰器

  /* 自动关闭标签配置 */
  "auto-close-tag.enableAutoCloseTag": true, // 自动自动闭合标签
  "auto-close-tag.activationOnLanguage": ["*"], // 在所有语言下都生效

  /* eslint 配置 */
  "eslint.enable": true, // 启动eslint插件
  "eslint.format.enable": true, // 是否启用 eslint 格式化功能
  "eslint.validate": ["javascript", "typescript", "vue", "html"],

  /** stylelint 配置 */
  "stylelint.validate": ["css", "less", "vue"],

  /* auto-rename-tag 配置 */
  "auto-rename-tag.activationOnLanguage": [
    "html",
    "vue",
    "liquid",
    "javascript",
    "jsx"
  ],

  /* live server 配置 */
  "liveServer.settings.donotShowInfoMsg": true,

  /* Path Intellisense 配置 */
  "path-intellisense.autoSlashAfterDirectory": true, // 用于控制在输入目录路径后是否自动添加斜杠（/）或反斜杠（\）。这项设置可以帮助提高文件路径的输入效率，特别是在需要频繁导航目录结构时
  "path-intellisense.autoTriggerNextSuggestion": true, // 它控制在输入文件路径时是否自动触发下一个建议

  /* gitlens 配置 */
  "gitlens.advanced.messages": {
    "suppressGitMissingWarning": true
  },

  /* todo-tree 配置 */
  "todo-tree.general.tags": ["TODO", "FIXME", "NOTE"],
  "todo-tree.highlights.customHighlight": {
    "TODO": {
      "icon": "clock",
      "gutterIcon": true,
      "fontWeight": "800",
      "foreground": "#fff",
      "background": "#FFFF00",
      "rulerColour": "#FFFF00",
      "iconColour": "#FFFF00"
    },
    "FIXME": {
      "icon": "x-circle",
      "gutterIcon": true,
      "fontWeight": "800",
      "foreground": "#fff",
      "background": "#FF0000",
      "rulerColour": "#FF0000",
      "iconColour": "#FF0000"
    },
    "NOTE": {
      "icon": "note",
      "gutterIcon": true,
      "fontWeight": "800",
      "foreground": "#fff",
      "background": "#008000",
      "rulerColour": "#008000",
      "iconColour": "#008000"
    }
  },

  /* prettier 配置 */
  "prettier.documentSelectors": ["*.{html}"],

  /* volar 配置 */
  "vue.autoInsert.dotValue": true // 使用 ref 定义的变量时候，自动带.value
}