在前端领域中，ESLint 是一个很常用的代码检查工具，可以帮助我们提高代码的质量和可读性。但是，有时候我们并不需要对某些目录或者文件进行检查，这时候该怎么做呢？
本文将分享如何在 ESLint 中跳过目录和文件，让代码检查更加高效，内容详细且有深度和学习以及指导意义。
为什么需要跳过目录和文件
在实际开发中，有些目录或者文件可能会由其他工具进行处理，比如编译器、打包工具等。如果在 ESLint 中对这些目录或者文件进行检查，可能会引起一些不必要的问题，比如：
- 对于已经被处理过的文件或目录，ESLint 输出的错误信息可能会与实际情况不符，导致我们耗费大量时间误解问题；
- 对于处理时间较长的目录或者文件，ESLint 的检查可能会影响我们的开发效率。
因此，我们需要找到一种方法来跳过这些不需要检查的目录或者文件。
如何跳过目录和文件
在 ESLint 中，我们可以通过 .eslintignore 文件来指定哪些目录和文件应该跳过检查。
配置 .eslintignore 文件
在项目根目录下，新建一个名为 .eslintignore 的文件，将不需要进行 ESLint 检查的目录和文件名写入即可。
比如，如果我们想要跳过 node_modules 目录和 test.js 文件的检查，可以将以下内容写入 .eslintignore 文件：
node_modules test.js
注意，如果想跳过整个目录，需要在后面加上 / 符号，比如：
node_modules/
如果想跳过指定文件类型，可以使用通配符 *，比如：
*.png
配置 ESLint 忽略 .eslintignore
在一些特殊情况下，我们希望跳过某个目录或者文件的检查，但是 .eslintignore 文件中又不能简单地加入，这时候我们可以通过在 .eslintrc 文件中设置 ignorePatterns 来告诉 ESLint 忽略某些规则。
例如，在 .eslintrc 文件中加入以下配置：
{
"ignorePatterns": ["build/"]
}就可以让 ESLint 忽略 build 目录下的所有文件。
示例代码
在本例中，我们有一个简单的项目结构：
// javascriptcn.com 代码示例 ├── .eslintignore ├── .eslintrc.json ├── node_modules │ ├── ... │ ├── ... │ └── ... ├── package-lock.json ├── package.json ├── src │ ├── main.js │ ├── util.js │ └── subfolder │ ├── index.js │ └── module.js └── test.js
其中，我们希望跳过对 node_modules 目录和 test.js 文件的检查。
配置 .eslintignore 文件
在 .eslintignore 文件中加入以下内容即可：
node_modules test.js
配置 .eslintrc.json 文件
我们的 .eslintrc.json 文件如下：
// javascriptcn.com 代码示例
{
"env": {
"browser": true,
"commonjs": true,
"es6": true
},
"extends": "eslint:recommended",
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module"
},
"rules": {
"indent": ["error", 4],
"linebreak-style": ["error", "unix"],
"quotes": ["error", "single"],
"semi": ["error", "always"]
},
"ignorePatterns": ["test.js"]
}在 ignorePatterns 中加入 test.js 即可忽略对该文件的检查。如果还需要跳过对某些目录的检查，可以将目录名加入 ignorePatterns 中。
总结
通过本文的学习，我们可以了解到如何在 ESLint 中跳过目录和文件。通过配置 .eslintignore 或者在 .eslintrc 文件中设置 ignorePatterns 可以达到快速跳过某些文件或目录的检查的效果，提高我们的开发效率。在实际开发中，我们可以根据不同的情况灵活使用，让 ESLint 更好地服务我们的工作。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/652efd317d4982a6eb01c031