eslint-config-airbnb vs eslint-config-standard vs eslint-config-google
JavaScript コードスタイルガイド
eslint-config-airbnbeslint-config-standardeslint-config-google類似パッケージ:

JavaScript コードスタイルガイド

これらの ESLint 設定パッケージは、JavaScript コードの一貫性と品質を保つためのルールを提供します。各パッケージは異なるスタイルガイドに基づいており、プロジェクトのニーズに応じて選択することができます。これにより、チーム全体でのコーディングスタイルの統一が図られ、可読性やメンテナンス性が向上します。

npmのダウンロードトレンド

3 年

GitHub Starsランキング

統計詳細

パッケージ
ダウンロード数
Stars
サイズ
Issues
公開日時
ライセンス
eslint-config-airbnb3,528,177148,09881.7 kB187-MIT
eslint-config-standard3,140,8702,65216.1 kB293年前MIT
eslint-config-google535,6611,773-157年前Apache-2.0

機能比較: eslint-config-airbnb vs eslint-config-standard vs eslint-config-google

ルールの厳格さ

  • eslint-config-airbnb:

    Airbnb の設定は非常に厳格で、詳細なルールが多く、特に React の使用に対して強い推奨があります。これにより、コードの一貫性が高まり、バグを減少させることができます。

  • eslint-config-standard:

    Standard は、最小限のルールを提供し、簡潔さを重視しています。ルールが少ないため、開発者がすぐに適応でき、迅速な開発が可能です。

  • eslint-config-google:

    Google の設定は、比較的緩やかなルールを持ち、開発者が自由にコーディングできる余地を残しています。これにより、チームのスタイルに合わせて柔軟に対応できます。

設定の簡便さ

  • eslint-config-airbnb:

    Airbnb の設定は多くのルールを含むため、初期設定がやや複雑ですが、詳細なドキュメントが提供されています。

  • eslint-config-standard:

    Standard は、設定が非常に簡単で、すぐにプロジェクトに組み込むことができます。特別な設定なしで使用できるのが魅力です。

  • eslint-config-google:

    Google の設定は、比較的簡単に導入でき、すぐに使用を開始できるのが特徴です。

コミュニティのサポート

  • eslint-config-airbnb:

    Airbnb のスタイルガイドは広く使われており、コミュニティからのサポートが豊富です。多くのリソースや事例が存在します。

  • eslint-config-standard:

    Standard はシンプルなため、コミュニティも活発で、サポートが得やすいです。

  • eslint-config-google:

    Google のスタイルガイドも人気があり、広範なドキュメントとサポートが提供されています。

拡張性

  • eslint-config-airbnb:

    Airbnb の設定は、他のプラグインやルールと組み合わせて拡張することが容易です。特に、React や TypeScript との統合がスムーズです。

  • eslint-config-standard:

    Standard はシンプルなため、拡張性はありますが、他のルールとの統合には工夫が必要です。

  • eslint-config-google:

    Google の設定も拡張可能ですが、他のスタイルガイドと組み合わせる際には注意が必要です。

学習曲線

  • eslint-config-airbnb:

    Airbnb の設定は多くのルールがあり、初心者には学習曲線が急ですが、ルールを理解することでコードの質が向上します。

  • eslint-config-standard:

    Standard は非常にシンプルで、すぐに理解できるため、特に初心者にとっては最適な選択です。

  • eslint-config-google:

    Google の設定は比較的学習しやすく、シンプルなルールが多いため、初心者にも適しています。

選び方: eslint-config-airbnb vs eslint-config-standard vs eslint-config-google

  • eslint-config-airbnb:

    Airbnb のスタイルガイドは、広く使用されており、特に React プロジェクトに適しています。詳細なルールが多く、厳格なスタイルを求めるチームに向いています。

  • eslint-config-standard:

    Standard は、最小限の設定で簡潔なスタイルを提供します。特に初心者や、シンプルなプロジェクトに最適です。ルールが少なく、すぐに使い始めることができます。

  • eslint-config-google:

    Google のスタイルガイドは、シンプルで明確なルールを提供します。Google の開発基準に従いたい場合や、比較的緩やかなルールを好む場合に適しています。

eslint-config-airbnb のREADME

eslint-config-airbnb

npm version

This package provides Airbnb's .eslintrc as an extensible shared config.

Usage

We export three ESLint configurations for your usage.

eslint-config-airbnb

Our default export contains most of our ESLint rules, including ECMAScript 6+ and React. It requires eslint, eslint-plugin-import, eslint-plugin-react, eslint-plugin-react-hooks, and eslint-plugin-jsx-a11y. Note that it does not enable our React Hooks rules. To enable those, see the eslint-config-airbnb/hooks section.

If you don't need React, see eslint-config-airbnb-base.

  1. Install the correct versions of each package, which are listed by the command:
npm info "eslint-config-airbnb@latest" peerDependencies

If using npm 5+, use this shortcut

npx install-peerdeps --dev eslint-config-airbnb

If using yarn, you can also use the shortcut described above if you have npm 5+ installed on your machine, as the command will detect that you are using yarn and will act accordingly. Otherwise, run npm info "eslint-config-airbnb@latest" peerDependencies to list the peer dependencies and versions, then run yarn add --dev <dependency>@<version> for each listed peer dependency.

If using npm < 5, Linux/OSX users can run

(
  export PKG=eslint-config-airbnb;
  npm info "$PKG@latest" peerDependencies --json | command sed 's/[\{\},]//g ; s/: /@/g' | xargs npm install --save-dev "$PKG@latest"
)

Which produces and runs a command like:

npm install --save-dev eslint-config-airbnb eslint@^#.#.# eslint-plugin-jsx-a11y@^#.#.# eslint-plugin-import@^#.#.# eslint-plugin-react@^#.#.# eslint-plugin-react-hooks@^#.#.#

If using npm < 5, Windows users can either install all the peer dependencies manually, or use the install-peerdeps cli tool.

npm install -g install-peerdeps
install-peerdeps --dev eslint-config-airbnb

The cli will produce and run a command like:

npm install --save-dev eslint-config-airbnb eslint@^#.#.# eslint-plugin-jsx-a11y@^#.#.# eslint-plugin-import@^#.#.# eslint-plugin-react@^#.#.# eslint-plugin-react-hooks@^#.#.#
  1. Add "extends": "airbnb" to your .eslintrc

eslint-config-airbnb/hooks

This entry point enables the linting rules for React hooks (requires v16.8+). To use, add "extends": ["airbnb", "airbnb/hooks"] to your .eslintrc.

eslint-config-airbnb/whitespace

This entry point only errors on whitespace rules and sets all other rules to warnings. View the list of whitespace rules here.

eslint-config-airbnb/base

This entry point is deprecated. See eslint-config-airbnb-base.

eslint-config-airbnb/legacy

This entry point is deprecated. See eslint-config-airbnb-base.

See Airbnb's JavaScript styleguide and the ESlint config docs for more information.

Improving this config

Consider adding test cases if you're making complicated rules changes, like anything involving regexes. Perhaps in a distant future, we could use literate programming to structure our README as test cases for our .eslintrc?

You can run tests with npm test.

You can make sure this module lints with itself using npm run lint.