@angular-eslint/eslint-plugin (original) (raw)

@angular-eslint/eslint-plugin

Please see https://github.com/angular-eslint/angular-eslint for full usage instructions and guidance.

Premade configs

Rules

Possible problems

Key

Rule Description ✅ 🔧 💡
contextual-lifecycle Ensures that lifecycle methods are used in a correct context ✅
no-async-lifecycle-method Angular Lifecycle methods should not be async. Angular does not wait for async lifecycle but the code incorrectly suggests it does.
no-attribute-decorator The @Attribute decorator is used to obtain a single value for an attribute. This is a much less common use-case than getting a stream of values (using @Input), so often the @Attribute decorator is mistakenly used when @Input was what was intended. This rule disallows usage of @Attribute decorator altogether in order to prevent these mistakes.
require-lifecycle-on-prototype Ensures that lifecycle methods are defined on the object's prototype instead of on an instance.
sort-lifecycle-methods Ensures that lifecycle methods are declared in order of execution

Suggestions

Key

Rule Description ✅ 🔧 💡
component-class-suffix Classes decorated with @Component must have suffix "Component" (or custom) in their name. See more at https://angular.dev/style-guide#style-02-03 ✅
component-max-inline-declarations Enforces a maximum number of lines in inline template, styles and animations. See more at https://angular.dev/style-guide#style-05-04
component-selector Component selectors should follow given naming rules. See more at https://angular.dev/style-guide#style-02-07, https://angular.dev/style-guide#style-05-02 and https://angular.dev/style-guide#style-05-03.
consistent-component-styles Ensures consistent usage of styles/styleUrls/styleUrl within Component metadata 🔧
contextual-decorator Ensures that classes use contextual decorators in its body
directive-class-suffix Classes decorated with @Directive must have suffix "Directive" (or custom) in their name. See more at https://angular.dev/style-guide#style-02-03 ✅
directive-selector Directive selectors should follow given naming rules. See more at https://angular.dev/style-guide#style-02-06 and https://angular.dev/style-guide#style-02-08.
no-conflicting-lifecycle Ensures that directives not implement conflicting lifecycle interfaces.
no-duplicates-in-metadata-arrays Ensures that metadata arrays do not contain duplicate entries.
no-empty-lifecycle-method Disallows declaring empty lifecycle methods ✅ 💡
no-forward-ref Disallows usage of forwardRef references for DI
no-input-prefix Ensures that input bindings, including aliases, are not named or prefixed by the configured disallowed prefixes
no-input-rename Ensures that input bindings are not aliased ✅ 🔧 💡
no-inputs-metadata-property Disallows usage of the inputs metadata property. See more at https://angular.dev/style-guide#style-05-12 ✅
no-lifecycle-call Disallows explicit calls to lifecycle methods
no-output-native Ensures that output bindings, including aliases, are not named as standard DOM events ✅
no-output-on-prefix Ensures that output bindings, including aliases, are not named "on", nor prefixed with it. See more at https://angular.dev/style-guide#style-05-16 ✅
no-output-rename Ensures that output bindings are not aliased ✅ 🔧 💡
no-outputs-metadata-property Disallows usage of the outputs metadata property. See more at https://angular.dev/style-guide#style-05-12 ✅
no-pipe-impure Disallows the declaration of impure pipes 💡
no-queries-metadata-property Disallows usage of the queries metadata property. See more at https://angular.dev/style-guide#style-05-12.
pipe-prefix Enforce consistent prefix for pipes.
prefer-on-push-component-change-detection Ensures component's changeDetection is set to ChangeDetectionStrategy.OnPush 💡
prefer-output-readonly Prefer to declare @Output, OutputEmitterRef and OutputRef as readonly since they are not supposed to be reassigned 💡
prefer-signals Use readonly signals instead of @Input(), @ViewChild() and other legacy decorators 🔧
prefer-standalone Ensures Components, Directives and Pipes do not opt out of standalone ✅ 🔧
relative-url-prefix The ./ and ../ prefix is standard syntax for relative URLs; don't depend on Angular's current ability to do without that prefix. See more at https://angular.dev/style-guide#style-05-04
require-localize-metadata Ensures that $localize tagged messages contain helpful metadata to aid with translations.
runtime-localize Ensures that $localize tagged messages can use runtime-loaded translations.
use-component-selector Component selector must be declared
use-component-view-encapsulation Disallows using ViewEncapsulation.None 💡
use-injectable-provided-in Using the providedIn property makes Injectables tree-shakable 💡
use-lifecycle-interface Ensures that classes implement lifecycle interfaces corresponding to the declared lifecycle methods. See more at https://angular.dev/style-guide#style-09-01 🔧
use-pipe-transform-interface Ensures that Pipes implement PipeTransform interface ✅ 🔧