专为JavaScript服务的代码检查工具。ESLint通过对工程目录中的js或jsx文件执行自动扫描来查找常见的语法和代码风格错误（安装插件后即可支持ts和tsx），并根据用户设定的报警等级给出提示，甚至还可以配置自动修复策略

一、js代码校验工具

1、安装

a、安装命令

pnpm add eslint -D

b、依赖说明

依赖名称	说明	官网文档
eslint	格式化工具	eslint.cn

c、初始化命令

npx eslint --init

// 可以继续吗？（y）
Ok to proceed? (y) 

// ? 您想如何使用ESLint？
? How would you like to use ESLint?
// 仅检查语法
To check syntax only
// ❯ 检查语法并查找问题
❯ To check syntax and find problems
// 要检查语法、查找问题并强制执行代码样式
To check syntax, find problems, and enforce code style

// ? 您的项目使用什么类型的模块？
? What type of modules does your project use?
// ❯ JavaScript模块（导入/导出）
❯ JavaScript modules (import/export)
// CommonJS（需要/导出）
CommonJS (require/exports)
// 这些都没有
None of these

// ? 您的项目使用哪个框架？
? Which framework does your project use?
❯ React
Vue.js
// 这些都没有
None of these

// ? 您的项目使用TypeScript吗？› 否 / 是
? Does your project use TypeScript? › No / Yes

// ? 您的代码在哪里运行…（按＜空格＞选择，＜a＞切换全部，＜i＞反转选择）
? Where does your code run? …  (Press <space> to select, <a> to toggle all, <i> to invert selection)
// ✔ 浏览器
✔ Browser
✔ Node

// ? 您希望配置文件采用什么格式？
? What format do you want your config file to be in?
❯ JavaScript
YAML
JSON

// ? 您想现在安装它们吗？› 否 / 是
? Would you like to install them now? › No / Yes

// ? 要使用哪个包管理器？
? Which package manager do you want to use?
❯ npm
yarn
pnpm

2、配置.eslintrc

{
  // 到此为止，不再往上找配置
  "root": true,
  "env": {
    "browser": true,
    "es2022": true,
    "node": true
  },
  "extends": [
    "eslint:recommended",
    "plugin:vue/vue3-essential",
    "plugin:@typescript-eslint/recommended",
    "plugin:prettier/recommended"
  ],
  "overrides": [
  ],
  "parser": "vue-eslint-parser",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "ecmaVersion": "latest",
    "parser": "@typescript-eslint/parser",
    "sourceType": "module"
  },
  "plugins": [
    "vue",
    "@typescript-eslint",
    "prettier"
  ],
  "rules": {
  }
}

3、.eslintignore

node_modules
dist

4、在 package.json scrips 添加脚本

 "lint": "eslint . --ext .vue,.js,.jsx,.ts,.tsx --fix"