【每日知识】ESLint 插件自动格式化操作手册（前端必备）

按照 ESLint 规则自动格式化需要借助 2 个插件：

• ESLint （读取 ESLint 配置文件进行语法检测）
• Prettier ESLint（按照 ESLint 配置文件进行格式化）

使用步骤：

1. 安装插件

   

2. 修改默认格式化插件

   找到任意代码文件

   右键点击代码区域

   选择「使用...格式化文档」

   

3. 选择「配置默认格式化程序」

   

4. 选择「Prettier ESLint」

   

到此，已经可以实现「Alt + Shift + F」进行自动格式化啦！

如果希望按「Ctrl + S」自动格式化，还需做以下配置：

1. 打开 JSON 格式的设置文件

   找到菜单栏的文件

   首选项

   设置

   

   点击用户区的设置 JSON 图标

   

2. 将以下配置粘贴进设置 JSON 文件中

   {
     "eslint.enable": true,
     "eslint.run": "onType",
     "eslint.options": {
         "extensions": [
             ".js",
             ".vue",
             ".jsx",
             ".tsx"
         ]
     },
     "editor.codeActionsOnSave": {
         "source.fixAll.eslint": true
     }
   }
   复制代码

   

到此为止，即可实现保存自动格式化，如果格式化并未按照 ESLint 规则进行，需要将其他所有格式化插件卸载！例如：Beautify、xxxFormatxxx