@zerebos/eslint-config

A comprehensive base ESLint configuration for modern JavaScript projects with flexible environment support.

Features

• 🚀 Built on ESLint's recommended configuration
• 🌍 Flexible globals: Node.js, Browser, Universal, or None
• 📦 Composable configurations for different project types
• 🔒 Security-focused rules and best practices
• 🎨 Consistent code style and formatting
• ⚡ Performance optimizations
• 🧹 Modern JavaScript standards (ES2022+)

Installation

npm install -D @zerebos/eslint-config eslint

Usage

Quick Start

For most projects, use the universal configuration that includes both Node.js and browser globals:

import {universal} from "@zerebos/eslint-config";

export default universal;

Environment-Specific Configurations

Choose the configuration that matches your project environment:

Node.js Projects

import {node} from "@zerebos/eslint-config";

export default node;

Browser/Frontend Projects

import {browser} from "@zerebos/eslint-config";

export default browser;

No Globals (Maximum Control)

import {base} from "@zerebos/eslint-config";

export default base;

Advanced Composition

Mix and match configurations for complex projects:

import {base, node, browser} from "@zerebos/eslint-config";

export default [
  // Apply base rules to all files
  ...base,

  // Node-specific rules for server files
  {
    files: ["server/**/*", "scripts/**/*"],
    ...node[1] // Get the globals config
  },

  // Browser-specific rules for client files
  {
    files: ["src/**/*", "public/**/*"],
    ...browser[1] // Get the globals config
  }
];

Extending the Configuration

Override or add custom rules as needed:

import {universal} from "@zerebos/eslint-config";

export default [
  ...universal,
  {
    rules: {
      // Override rules
      "no-console": "warn", // Change from error to warning
      "quotes": ["error", "single"], // Prefer single quotes

      // Add custom rules
      "prefer-arrow-callback": "error"
    }
  }
];

What's Included

Language Support

• ECMAScript Version: Latest (ES2022+)
• Module Type: ES Modules
• Source Type: Module

Key Rule Categories

Code Quality & Best Practices

• Error Prevention: no-undef, no-redeclare, no-unreachable
• Modern JavaScript: prefer-const, no-var, arrow-spacing
• Performance: no-useless-call, no-useless-computed-key
• Maintainability: no-duplicate-imports, no-else-return

Code Style & Formatting

• Spacing: Consistent spacing around operators, keywords, and blocks
• Quotes: Double quotes with template literal support
• Semicolons: Required for statement termination
• Braces: Stroustrup style with single-line allowance
• Indentation: No tabs, consistent spacing

Security & Safety

• Eval Protection: no-eval, no-implied-eval, no-new-func
• Prototype Safety: Controlled prototype manipulation
• Template Security: no-template-curly-in-string

Configuration Details

Globals by Environment

Node Configuration

Includes Node.js globals like process, Buffer, __dirname, etc.

Browser Configuration

Includes browser globals like window, document, console, etc.

Universal Configuration

Combines both Node.js and browser globals for fullstack projects.

Base Configuration

No environment globals - you define what's available.

Disabled Rules

• no-prototype-builtins: Disabled for flexibility with object methods

Custom Rule Configurations

• linebreak-style: Enforces Unix-style line endings
• object-curly-spacing: Never with special object handling
• operator-linebreak: None, with special cases for ternary operators
• space-unary-ops: Words require spaces, symbols don't (except typeof)

Integration with Other Tools

Prettier

This config is designed to work alongside Prettier. Install it separately:

npm install -D prettier

TypeScript

For TypeScript projects, combine with the TypeScript config:

npm install -D @zerebos/eslint-config-typescript

import {universal} from "@zerebos/eslint-config";
import {typescript} from "@zerebos/eslint-config-typescript";

export default [
  ...universal,
  ...typescript
];

VS Code

For the best experience, install the ESLint extension and add to your settings:

{
  "eslint.workingDirectories": ["."],
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}

Common Use Cases

React Project

import {browser} from "@zerebos/eslint-config";

export default browser;

Node.js API

import {node} from "@zerebos/eslint-config";

export default node;

Fullstack Monorepo

import {base, node, browser} from "@zerebos/eslint-config";

export default [
  ...base,
  {
    files: ["apps/api/**/*"],
    ...node[1]
  },
  {
    files: ["apps/web/**/*"],
    ...browser[1]
  }
];

Library Development

import {universal} from "@zerebos/eslint-config";

export default [
  ...universal,
  {
    rules: {
      // Libraries should avoid console output
      "no-console": "error"
    }
  }
];

Migration Guide

From Legacy ESLint Configs

If migrating from .eslintrc.* files:

1. Replace your old config file with eslint.config.js
2. Change from extends to import statements
3. Use array spread syntax instead of string extends

Before:

{
  "extends": ["@zerebos/eslint-config"]
}

After:

import {universal} from "@zerebos/eslint-config";
export default universal;

Troubleshooting

"Module not found" errors

Ensure you're using Node.js 16+ and have "type": "module" in your package.json, or use .mjs extension for your config file.

Rules not applying

Check that your eslint.config.js is in the project root and properly exports the configuration array.

Conflicting rules

If using multiple configs, later rules override earlier ones. Place more specific configurations after general ones.

Contributing

Issues and pull requests are welcome! Please check the main repository for contribution guidelines.

Related Packages

• @zerebos/eslint-config-typescript - TypeScript ESLint configuration
• @zerebos/eslint-config-svelte - Svelte ESLint configuration