报错 eslint Cannot find module 'eslint-config-airbnb' 的解决方法

在开发前端代码的过程中，我们经常使用 ESLint 进行代码风格的检查。但是，有时候我们在执行 ESLint 命令时会出现 cannot find module 'eslint-config-airbnb' 的错误提示，导致无法进行代码检查。

出现这个错误的原因是 ESLint 没有找到 'eslint-config-airbnb' 模块，需要我们手动安装这个模块并配置。

下面是解决这个问题的具体步骤。

步骤一：安装 'eslint-config-airbnb' 模块

在终端中执行以下命令：

npm install eslint-config-airbnb --save-dev

该命令会将 'eslint-config-airbnb' 模块安装到本地项目中的 node_modules 文件夹中，并将其添加到 package.json 文件中的 devDependencies 字段中。

步骤二：配置 '.eslintrc' 文件

在项目根目录下创建一个名为 '.eslintrc' 的文件，该文件用于配置 eslint 规则。

在 '.eslintrc' 文件中添加以下内容：

{
  "extends": "airbnb-base"
}

其中，"extends": "airbnb-base" 的含义是使用 'eslint-config-airbnb' 模块中的规则作为 ESLint 配置。

示例代码

以下是一个简单的示例代码，用于演示在项目中如何使用 ESLint 并解决以上报错。

// index.js
const foo = 'hello';
console.log(foo);

// .eslintrc
{
  "extends": "airbnb-base"
}

在终端中执行以下命令：

npx eslint index.js

会输出以下结果：

/Users/username/project/index.js
  1:5  error  Unexpected var, use let or const instead  no-var
  2:13  error  Strings must use doublequote             quotes
  2:20  error  Missing semicolon                        semi

✖ 3 problems (3 errors, 0 warnings)

以上输出结果表示在代码中存在三个问题，分别是使用 var 来定义变量、字符串应该使用双引号、缺少分号等，这些问题都是 'eslint-config-airbnb' 模块自带的规则检查。

结论

以上就是解决 ESLint 报错 cannot find module 'eslint-config-airbnb' 的方法，我们只需要安装 'eslint-config-airbnb' 模块，并在 '.eslintrc' 文件中设置 "extends": "airbnb-base" 即可。通过学习和实践，我们不仅能够掌握此类问题的解决方法，还能够进一步提高代码的质量和规范性。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/677498156d66e0f9aaee7842