[!NOTE] This project hasn’t reached a major release yet, so behavior and options may change. Please feel free to report false negatives/positives and any rough edges as issues.

Install

• npm: npm i -D eslint-plugin-baseline-js
• pnpm: pnpm add -D eslint-plugin-baseline-js
• yarn: yarn add -D eslint-plugin-baseline-js

Recommended

• ESLint >= 8.57 (Flat Config)

Quick Start (Flat Config)

// eslint.config.js
import baselineJs from "eslint-plugin-baseline-js";

export default [
  {
    files: ["**/*.{js,ts,jsx,tsx}"],
    plugins: { "baseline-js": baselineJs },
    rules: {
      // Allow only "widely available" Baseline features
      "baseline-js/use-baseline": ["error", { available: "widely" }],
    },
  },
];

Preset Configs

This plugin ships Flat Config presets you can call from configs:

import baselineJs from "eslint-plugin-baseline-js";

export default [
  // Register the plugin once (required for Flat Config)
  { plugins: { "baseline-js": baselineJs } },

  // Recommended: enables Web APIs & JS builtins detection with `preset: 'auto'`.
  // Level defaults to 'error'; pass level to change severity
  baselineJs.configs.recommended({ available: "widely", level: "warn" }),

  // TypeScript-aware: requires type info for instance-member checks (`preset: 'type-aware'`).
  // Works best with @typescript-eslint/parser and a proper tsconfig.
  // baselineJs.configs["recommended-ts"]({ available: "widely", level: "error" }),
];

Note on plugin key

• Presets assume the plugin is registered under the key "baseline-js".

See more real-world configs in examples/

Common Configurations

// Newly available (more permissive)
'baseline-js/use-baseline': ['warn', { available: 'newly' }];

// Year-based – allow features that became Baseline in or before 2020
'baseline-js/use-baseline': ['error', { available: 2020 }];

// Ignore knobs for pragmatic adoption
'baseline-js/use-baseline': [
  'error',
  {
    available: 2018,
    // Skip specific web-features by ID (or regex as '/.../')
    ignoreFeatures: ['nullish-coalescing', '/^optional-/'],
    // Skip reports produced on certain ESTree node types
    ignoreNodeTypes: ['WithStatement', '/Expression$/'],
  },
];

// Turn off in tests or generated folders (ESLint standard overrides)
export default [
  { /* project defaults ... */ },
  {
    files: ['**/*.test.*', 'coverage/**'],
    rules: { 'baseline-js/use-baseline': 'off' },
  },
];

What Gets Reported?

Features from web‑features (group: "javascript") that exceed your configured Baseline.

Demo

How It Works

1. Data → scripts/data/build-features.mjs
   • Extracts the minimal JavaScript subset from web‑features into src/baseline/data/features.javascript.ts.
2. Mapping → src/baseline/mapping/syntax.ts
   • Maps web‑features IDs to underlying rules (prefer eslint-plugin-es-x / ESLint core; custom rules only when necessary).
3. Resolution → src/baseline/resolve.ts
   • Classifies “beyond baseline” by bucket (high/low/false → widely/newly/limited) or year.

Coverage

We publish a generated coverage report that lists all JavaScript features from web‑features and shows which ones are currently mapped by this plugin.

• Report: docs/coverage.md
• Regenerate locally: pnpm gen:coverage
  • Generator: scripts/coverage/generate-coverage.mjs

Options (rule)

Use with oxlint

Runs as an oxlint JS plugin. Just drop it into .oxlintrc.json:

// .oxlintrc.json
{
  "jsPlugins": ["eslint-plugin-baseline-js"],
  "rules": {
    "baseline-js/use-baseline": [
      "warn",
      {
        "available": "widely",
        "includeWebApis": { "preset": "auto" },
        "includeJsBuiltins": { "preset": "auto" }
      }
    ]
  }
}

[!CAUTION] No type-aware detection under oxlint. Checks that need TypeScript type resolution (e.g., Set.difference(), Iterator.map()) won't fire. Use ESLint with the type-aware preset if you need them.

Baseline for HTML, CSS, and React

Baseline works best when HTML, CSS, JS, and React all align. For markup, styles, and React, enable the "use-baseline" rules from these ESLint plugins:

• ESLint for CSS: https://github.com/eslint/css
• HTML ESLint (HTML): https://github.com/yeonjuan/html-eslint
• HTML ESLint (React): https://github.com/yeonjuan/html-eslint/tree/main/packages/eslint-plugin-react

Branding Note (Baseline)

The Baseline name and logos are Google trademarks. Logo assets are licensed under CC BY‑ND 4.0. If you use Baseline logos alongside this plugin, please follow the official guidelines and do not imply sponsorship, affiliation, or endorsement by Google. We embed the official Baseline icons via their published URLs (unmodified).

License

MIT