tessl/npm-eslint-config-airbnb

Airbnb's comprehensive ESLint configuration as an extensible shared config for JavaScript and React projects

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Pending

The risk profile of this skill

Overview

Eval results

Files

Main Configuration

Name: tessl/npm-eslint-config-airbnb
Author: tessl

The main ESLint configuration provides Airbnb's complete ruleset including ECMAScript 6+ features, React components, and JSX accessibility guidelines.

Capabilities

Default Configuration

The main configuration extends eslint-config-airbnb-base and adds React-specific rules.

/**
 * Main Airbnb ESLint configuration
 * Usage: extends: ['airbnb']
 */
const config = {
  extends: [
    'eslint-config-airbnb-base',
    './rules/react',
    './rules/react-a11y'
  ],
  rules: {}
};

Usage Examples:

// .eslintrc.js - Basic setup
module.exports = {
  extends: ['airbnb']
};

// .eslintrc.js - With custom overrides
module.exports = {
  extends: ['airbnb'],
  rules: {
    'react/jsx-filename-extension': ['error', { extensions: ['.js', '.jsx'] }],
    'import/prefer-default-export': 'off'
  }
};

// .eslintrc.js - With environment setup
module.exports = {
  extends: ['airbnb'],
  env: {
    browser: true,
    node: true,
    jest: true
  }
};

Required Peer Dependencies

The main configuration requires specific ESLint plugins to be installed:

interface PeerDependencies {
  eslint: string;                    // '^7.32.0 || ^8.2.0'
  'eslint-plugin-import': string;    // '^2.25.3'
  'eslint-plugin-jsx-a11y': string;  // '^6.5.1'
  'eslint-plugin-react': string;     // '^7.28.0'
  'eslint-plugin-react-hooks': string; // '^4.3.0'
}

Installation:

# Using npm
npm install --save-dev eslint-config-airbnb eslint eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks

# Using npx shortcut (npm 5+)
npx install-peerdeps --dev eslint-config-airbnb

Configuration Structure

The configuration object follows standard ESLint format:

interface MainConfiguration {
  extends: string[];
  rules: Record<string, ESLintRuleConfig>;
}

type ESLintRuleConfig = 
  | 'off' | 'warn' | 'error'
  | 0 | 1 | 2
  | [('off' | 'warn' | 'error' | 0 | 1 | 2), ...any[]];

Included Rule Categories

The main configuration includes rules from multiple categories:

interface IncludedRules {
  // From eslint-config-airbnb-base
  es6Rules: boolean;           // ECMAScript 6+ features
  importRules: boolean;        // Import/export statements
  styleRules: boolean;         // Code style and formatting
  bestPracticesRules: boolean; // Best practices and error prevention
  
  // From React rules
  reactRules: boolean;         // React component rules
  jsxRules: boolean;          // JSX syntax and formatting
  
  // From React A11y rules
  accessibilityRules: boolean; // ARIA and accessibility rules
}

Rule Categories:

ECMAScript 6+: Arrow functions, classes, destructuring, template literals
Import/Export: Module imports, exports, and dependencies
React: Component definition, lifecycle methods, prop validation
JSX: JSX syntax, formatting, and best practices
Accessibility: ARIA attributes, semantic HTML, keyboard navigation

Install with Tessl CLI

npx tessl i tessl/npm-eslint-config-airbnb

docs

base-configuration.md

hooks-configuration.md

index.md

legacy-configuration.md

main-configuration.md

rule-modules.md

whitespace-configuration.md

tile.json

tessl/npm-eslint-config-airbnb