eslint-plugin-react-web-api

4.2.3 verified Sat Apr 25 auth: no javascript

An ESLint plugin for React that enforces correct usage of Web APIs, preventing common mistakes like missing cleanup in useEffect and unsafe fetch calls. Version 4.2.3 is the latest stable release for ESLint v10 and TypeScript 5.x. It is part of the eslint-react ecosystem, offering rules such as `no-leaked-fetch` and `no-missing-cleanup`. Unlike generic ESLint plugins, it is specifically tailored for React's lifecycle with TypeScript support and ships bundled type definitions.

Common errors

error ESLint couldn't find the plugin 'eslint-plugin-react-web-api'. ↓

cause The plugin is not installed or is not in node_modules.

fix

Run npm install eslint-plugin-react-web-api --save-dev.

error Cannot find module 'eslint-plugin-react-web-api' ↓

cause The package is ESM-only and require is used instead of import.

fix

Use dynamic import or set "type": "module" in package.json.

error Plugin 'react-web-api' was not found. ↓

cause The plugin was not added to the `plugins` array in the flat config.

fix

Add import reactWebApi from 'eslint-plugin-react-web-api' and reference it in plugins: { 'react-web-api': reactWebApi }.

Warnings

breaking ESLint v10 is required. Versions 4.x do not support ESLint <10. ↓

fix Upgrade ESLint to v10+.

breaking Node.js >=22 is required. The plugin uses ESM only. ↓

fix Upgrade Node.js to v22+ or use a bundler that handles ESM.

gotcha The plugin must be placed in the 'plugins' array of the flat config, not as a string in the 'extends' array. ↓

fix Use `plugins: { 'react-web-api': reactWebApi }` instead of `extends: ['plugin:react-web-api/recommended']`.

deprecated The legacy `.eslintrc` format is not supported. The plugin only works with the flat config (eslint.config.js). ↓

fix Migrate to flat config format.

Install

npm install eslint-plugin-react-web-api

yarn add eslint-plugin-react-web-api

pnpm add eslint-plugin-react-web-api

Imports

default

wrong

const reactWebApi = require('eslint-plugin-react-web-api')

correct

import reactWebApi from 'eslint-plugin-react-web-api'

The plugin is ESM-only; CommonJS require is not supported in Node >=22.

rules

wrong

import { rules } from 'eslint-plugin-react-web-api/rules'

correct

import { rules } from 'eslint-plugin-react-web-api'

Access rules directly from the plugin object; there is no separate export path.

configs
```
import { configs } from 'eslint-plugin-react-web-api'
```
Configurations are exported as 'configs' (e.g., configs.recommended).

Quickstart

Configures the plugin with two rules: no-leaked-fetch and no-missing-cleanup, using TypeScript parser for type-checked rules.

// eslint.config.js
import reactWebApi from 'eslint-plugin-react-web-api';
import tsParser from '@typescript-eslint/parser';

export default [
  {
    files: ['**/*.{js,jsx,ts,tsx}'],
    plugins: {
      'react-web-api': reactWebApi,
    },
    languageOptions: {
      parser: tsParser,
      parserOptions: {
        ecmaFeatures: { jsx: true },
      },
    },
    rules: {
      'react-web-api/no-leaked-fetch': 'warn',
      'react-web-api/no-missing-cleanup': 'error',
    },
  },
];