vscode格式化默认使用eslint

原创已于 2025-12-10 11:57:52 修改 · 69 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vscode #ide #编辑器

于 2025-12-10 11:03:48 首次发布

打开 VS Code 设置（Ctrl+,），修改以下配置（可直接编辑settings.json，快捷键：Ctrl+Shift+P → 输入「Open Settings (JSON)」）：

{
  // Vue 文件使用 Volar 插件进行格式化
  "[vue]": {
    "editor.defaultFormatter": "Vue.volar"
  },
  
  // 启用 ESLint 格式化功能
  "eslint.format.enable": true,
  
  // 针对不同文件类型设置 ESLint 格式化器（JavaScript/TypeScript）
  "[javascript]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
  },
  "[typescript]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
  },
  "[html]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
  },
  
  // 自动保存时修复 ESLint 问题（适用于有 ESLint 配置的项目）
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit"
  },
  
  // 确保 ESLint 对这些文件类型进行检查
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "vue",
    "html"
  ],

  // **自动根据项目是否包含 ESLint 配置文件，选择合适的格式化器**：
  "editor.formatOnSave": true,  // 自动格式化保存时
  "eslint.alwaysShowStatus": true,  // 显示 ESLint 状态栏
  "files.autoSave": "afterDelay",  // 设置自动保存时延
}