#atom

JavaScript and TypeScript code quality tool that identifies and fixes problems

Core Idea: ESLint is a static code analysis tool that identifies problematic patterns in JavaScript and TypeScript code, helping developers maintain consistent code style and avoid bugs.

Key Elements

• Key Features:

  • Pluggable architecture with customizable rules
  • Built-in code formatting capabilities
  • Support for modern JavaScript features
  • Integration with popular code editors
  • Automatic code fixing for many rules
  • TypeScript support

• Configuration Options:

  • .eslintrc.js or .eslintrc.json configuration files
  • Shareable configs for consistent standards across projects
  • Rule severity levels: "off", "warn", "error"
  • Support for rule-specific options and exceptions
  • File and directory exclusions via .eslintignore

• Common Rules Categories:

  • Possible errors detection
  • Best practices enforcement
  • Variable usage validation
  • Stylistic issues (formatting)
  • ES6/ES2015+ feature usage
  • React/JSX specific patterns

• Integration Methods:

  • Editor plugins (VS Code, WebStorm, etc.)
  • Command line interface
  • Build system integration
  • Git hooks via tools like Husky
  • CI/CD pipeline integration

• Implementation Example:

// Basic .eslintrc.js configuration
module.exports = {
  env: {
    browser: true,
    es2021: true,
    node: true,
  },
  extends: [
    'eslint:recommended',
    'plugin:react/recommended',
    'plugin:@typescript-eslint/recommended',
  ],
  parser: '@typescript-eslint/parser',
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 12,
    sourceType: 'module',
  },
  plugins: [
    'react',
    '@typescript-eslint',
  ],
  rules: {
    'indent': ['error', 2],
    'quotes': ['error', 'single'],
    'semi': ['error', 'always'],
  },
};

Connections

• Related Concepts: Lint Staged (runs ESLint on staged files), Husky Pre-commit Hooks (triggers ESLint before commits) ESLint Configurations
• Broader Context: Code Quality Tools (part of broader code quality ecosystem)
• Applications: Continuous Integration (used in CI pipelines for code validation)
• Components: ESLint Plugins (extends functionality), ESLint Rules (individual code checks)

References

1. ESLint Official Documentation: https://eslint.org/docs/latest/
2. "JavaScript Linting and Formatting with ESLint" by Nicholas C. Zakas

#javascript #typescript #linting #code-quality #static-analysis

Connections:

Sources:

• From: Syntax - Lint como un desarrollador senior con eslint + husky + lint staged + acciones de github