在 Devin 中试用 DeepWiki 处理私有仓库
DeepWiki

airbnb/javascript

菜单

安装与设置

相关源文件

本文档提供了在您的 JavaScript 项目中安装和设置 Airbnb 的 ESLint 配置的分步说明。它涵盖了基础 JavaScript 配置和 React 特定配置，以及它们的专门变体。

有关为特定项目需求自定义这些配置的信息，请参阅 自定义。有关与 IDE 和其他开发工具集成的详细信息，请参阅 与开发工具集成。

概述

Airbnb 提供了两个主要的 ESLint 配置包

  1. eslint-config-airbnb-base：适用于不使用 React 的 JavaScript 项目
  2. eslint-config-airbnb：适用于包含 React 的 JavaScript 项目（扩展了基础配置）

这两个包都通过 ESLint 强制执行 Airbnb 的 JavaScript 风格指南规则，以确保代码的一致性和质量。

来源：packages/eslint-config-airbnb/README.md1-79 packages/eslint-config-airbnb-base/README.md1-95

先决条件

在安装 Airbnb 的 ESLint 配置之前，请确保您已

  1. 安装了 Node.js 和 npm（或 yarn）
  2. 拥有一个已使用 package.json 初始化过的 JavaScript 项目

安装 eslint-config-airbnb-base

将此配置用于不包含 React 的 JavaScript 项目。它需要 eslint 和 eslint-plugin-import 作为对等依赖项。

安装步骤

使用 npm 5+

使用 yarn

如果您已安装 npm 5+

否则

  1. 确定所需的对等依赖项

  2. 单独安装每个依赖项

使用 npm < 5

对于 Linux/macOS

适用于Windows

安装 install-peerdeps 工具并使用它

来源：packages/eslint-config-airbnb-base/README.md15-61

安装 eslint-config-airbnb

将此配置用于包含 React 的 JavaScript 项目。它需要 eslint、eslint-plugin-import、eslint-plugin-react、eslint-plugin-react-hooks 和 eslint-plugin-jsx-a11y 作为对等依赖项。

安装步骤

使用 npm 5+

使用 yarn

如果您已安装 npm 5+

否则

  1. 确定所需的对等依赖项

  2. 单独安装每个依赖项

使用 npm < 5

对于 Linux/macOS

适用于Windows

安装 install-peerdeps 工具并使用它

来源：packages/eslint-config-airbnb/README.md11-57

配置设置

安装完所需包后，您需要配置 ESLint 来使用 Airbnb 的配置。

基本配置

在项目根目录下创建或编辑 .eslintrc 文件

对于不使用 React 的 JavaScript

对于使用 React 的 JavaScript

来源：packages/eslint-config-airbnb/README.md59 packages/eslint-config-airbnb-base/README.md63

专用配置

Airbnb 提供了几种适用于特定用例的专门配置

1. React Hooks 规则

要启用 React Hooks 的 linting 规则（需要 React v16.8+），请扩展 hooks 配置

来源：packages/eslint-config-airbnb/README.md61-63

2. 仅空格的规则

要仅强制执行空格规则（将所有其他规则设置为警告），请扩展 whitespace 配置

对于 React 项目

对于仅 JavaScript 项目

来源：packages/eslint-config-airbnb/README.md65-67 packages/eslint-config-airbnb-base/README.md93-95

3. 旧版支持 (ES5 及更早版本)

对于使用 ES5 或更低版本的项目，请使用 legacy 配置

来源：packages/eslint-config-airbnb-base/README.md65-89

配置关系

下图说明了不同配置选项之间的关系以及它们如何相互扩展

来源：packages/eslint-config-airbnb/README.md1-79 packages/eslint-config-airbnb-base/README.md1-95

验证

要验证您的安装和配置是否正常工作

  1. 创建一个包含已知 linting 问题的测试 JavaScript 文件，例如
  1. 在文件上运行 ESLint

您应该看到与 Airbnb 风格指南规则匹配的 linting 错误。

SublimeLinter 集成

如果您正在使用 Sublime Text 和 SublimeLinter，您还可以设置 Airbnb 的 JSHint 设置

  1. 从 https://github.com/SublimeLinter/SublimeLinter 安装 SublimeLinter
  2. 在 Sublime Text 中打开 SublimeLinter 包的用户首选项
    • 对于 Mac OS X：Sublime Text > Preferences > Package Settings > SublimeLinter > Settings - User
  3. 从 Airbnb 仓库复制 SublimeLinter 设置
  4. 保存设置文件

来源：linters/SublimeLinter/SublimeLinter.sublime-settings1-73

总结

本文档介绍了如何

  • 在 eslint-config-airbnb 和 eslint-config-airbnb-base 之间进行选择
  • 安装相应的配置包及其依赖项
  • 配置 ESLint 以使用 Airbnb 的风格指南规则
  • 为特定用例使用专门的配置
  • 验证安装是否正常工作

若要为您的特定项目需求自定义这些配置，请参阅 自定义。