eslint-plugin-rxjs-angular-x

This ESLint plugin is intended to prevent issues with combined use of RxJS and Angular.

There is no recommended configuration for this package, as all of the rules are opinionated.

Migrating from eslint-plugin-rxjs-angular

This project is a fork of eslint-plugin-rxjs-angular initially started to support the new ESLint flat config format.

• The old .eslintrc format is not supported.
  • If you need to continue using this old format, use the original eslint-plugin-rxjs or a different fork.

A complete description of all changes are documented in the CHANGELOG file.

Install

See typescript-eslint's Getting Started for a full ESLint setup guide.

Then enable the desired rules in your eslint.config.mjs and enable typed linting:

// @ts-check
import tseslint from 'typescript-eslint';
import rxjsAngularX from 'eslint-plugin-rxjs-angular-x';

export default tseslint.config({
    extends: [
        ...tseslint.configs.recommended,
    ],
    languageOptions: {
        parserOptions: {
            projectService: true,
        },
    },
    plugins: {
        'rxjs-angular-x': rxjsAngularX,
    },
    rules: {
        'rxjs-angular-x/prefer-async-pipe': 'error',
    },
});

The above example uses typescript-eslint's built-in config to set up the TypeScript parser for us. Enabling projectService then turns on typed linting. See Linting with Type Information for details.

Rules

The package includes the following rules:

💭 Requires type information.

Name	Description	💭
prefer-async-pipe	Disallow the calling of subscribe within Angular components.	💭
prefer-composition	Disallow subscribe calls that are not composed within Angular components (and, optionally, within services, directives, and pipes).	💭
prefer-takeuntil	Disallow subscribe calls without an accompanying takeUntil within Angular components (and, optionally, within services, directives, and pipes).	💭