ESLint 是前端代码静态检查工具，帮助我们在编写代码时遵循代码规范，提高代码质量，避免出现一些常见的错误。本文介绍如何在 VS Code 中配置 ESLint 并运行。
1. 安装 ESLint
在使用 ESLint 前，我们需要先安装 ESLint。在命令行中执行以下命令：
npm install -g eslint
2. 创建 ESLint 配置文件
可以手动创建 ESLint 配置文件 .eslintrc.js，也可以使用 npm 初始化项目时生成的配置文件 package.json。
在项目根目录下创建 .eslintrc.js，示例配置如下：
-- -------------------- ---- -------
-------------- - -
---- -
-------- -----
------- -----
--
-------- -
---------------------
---------------------------
--
-------------- -
------------- -
---- -----
--
------------ ---
----------- ---------
--
-------- -
--------
--
------ -
------------- --------
------------------- ------
--
--3. 配置 VS Code
在 VS Code 中按下 Ctrl + , 打开设置，搜索 eslint.validate，勾选选项，配置为：
"eslint.validate": [ "javascript", "javascriptreact", "typescript", "typescriptreact" ],
这样，当编辑器保存文件时，ESLint 就会自动检查代码，并在下方输出错误和警告信息。
4. 在 VS Code 中运行 ESLint
在 VS Code 中打开要检查的文件，如果代码不符合规范，会在下方输出错误和警告信息。可以点击错误或警告信息，跳转到出错的地方。
为了方便在命令行运行 ESLint，我们在 package.json 中添加脚本：
"scripts": {
"lint": "eslint src --ext .js,.jsx,.ts,.tsx"
},在命令行执行 npm run lint 就可以检查 src 目录下所有 JavaScript 和 TypeScript 文件是否符合规范。
总结
通过本文的介绍，我们了解了如何在 VS Code 中配置和运行 ESLint，优化代码质量，提高代码规范。通过使用 ESLint，可以更好地协同开发，在代码规范和代码质量上达成一致，提高团队开发效率。
参考资料：
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/647558dc968c7c53b026cc08