Airbnb JavaScript Style Guideとは？ESLint configとJavaScriptコーディング規約

ページ内ナビ

概要

Airbnb JavaScript Style Guideは、JavaScriptのcoding conventionを理由とESLint ruleへのlink付きでまとめたstyle guideです。const/let、object・array、function、module、naming、comment、testingなど広い範囲を扱い、同じ方針を実行可能なeslint-config-airbnbとeslint-config-airbnb-baseとして配布しています。

特徴と向いている用途

公式資料に基づく紹介・実機未検証 · 内容確認日：2026-10-03

主な特徴

JavaScriptの記述ルールと理由を一つのguideへ集約する

変数宣言、object/array、destructuring、function、module、comparison、naming、whitespaceなどをbad/good code例と理由付きで整理しています。

出典：[1]

ESLint shared configで規約をCIへ落とし込む

eslint-config-airbnbはES6+とReact向けruleを含み、React不要の場合はeslint-config-airbnb-baseを選べます。guideのruleをreviewだけでなくlintとして自動化できます。

出典：[2]

React Hooksやa11y ruleも追加構成できる

React configはReact、React Hooks、jsx-a11y、import pluginをpeer dependencyとして持ち、airbnb/hooks entry pointでHooks ruleを有効化できます。

出典：[2][3]

向いている用途

team共通のJavaScript styleを短期間で作りたいprojectに向く

coding conventionをゼロから議論する代わりに既知のbase lineを採用し、必要なruleだけoverrideする運用に向いています。

出典：[1]

導入前の確認

eslint-config-airbnb 19.0.4はESLint 7/8をpeer対象にする

current package manifestのpeerDependenciesはESLint ^7.32.0または^8.2.0で、ESLint 9を含みません。ESLint 9標準のflat config projectではcompatibility layerや別configを検討します。

出典：[3]

official setupはlegacy .eslintrc形式を前提にする

package READMEはextends: airbnbを.eslintrcへ追加する手順を案内しています。flat configへ移行済みprojectでは同じ手順をそのまま使えません。

出典：[2]

style guide自体はJavaScript標準ではなくteamの選択肢

規約には可読性や保守性に関するAirbnbの判断が含まれます。既存codebase、TypeScript、formatter、modern frameworkのruleと衝突する項目はteam側でoverride方針を決めます。

出典：[1][2]

参考にした公式資料

[1]Airbnb JavaScript Style Guide(2026-10-03)
[2]eslint-config-airbnb README(2026-10-03)
[3]eslint-config-airbnb package manifest(2026-10-03)
[4]eslint-config-airbnb-base package manifest(2026-10-03)
[5]Airbnb JavaScript MIT license(2026-10-03)

編集部からの補足

teamのJavaScript code review基準を一から決めず、広く知られた規約を叩き台にしたい場合に使いやすいguideです。ただしcurrent ESLint configはESLint 9/flat configをpeer rangeに含まないため、新規projectではそのまま標準採用せずtoolchain compatibilityを先に確認してください。

3ステップで試す

1
Airbnb ESLint configとpeer dependenciesを追加
official READMEのinstall-peerdeps手順を使います。ESLint 9 projectではpeer range外なのでこの手順を使わずcompatibilityを先に確認します。
npx install-peerdeps --dev eslint-config-airbnb@19.0.4
2
legacy ESLint configへAirbnb ruleを追加
Reactを使わない場合はeslint-config-airbnb-baseを選びます。既存.eslintrcがある場合は上書きせずextendsだけ統合してください。
printf '{ "extends": ["airbnb", "airbnb/hooks"] } ' > .eslintrc.json
3
lintを実行
既存codeとのrule差分を確認し、teamで必要なoverrideを決めます。
npx eslint . --ext .js,.jsx,.mjs

公式READMEで確認

成長

成長の推移 · 直近30日

148,304 Stars

推移データを蓄積中です。

開発アクティビティ

直近90日・週次

Commit（直近30日）: 0
Open PR: 69

開発アクティビティを蓄積中です。

Built with

JavaScript

カテゴリとタグ

GitHubデータ

GitHubのデータGitHubの詳細データを見る

GitHubで見る

GitHub Topics

javascript
eslint
naming-conventions
arrow-functions
style-guide
style-linter
es6
es2015
linting
styleguide
es2016
es2017

Stars: 148,304
Forks: 26,556
Watchers: 3,656
Open Issues: 99
Contributors: 401
所有者種別: Organization
主要言語: JavaScript
ライセンス: MIT
リポジトリ最終更新: 2026/04/16