Please see https://github.com/angular-eslint/angular-eslint for full usage instructions and guidance.
Key
- ✅ = recommended
- 🔧 = fixable
- 💡 = has suggestions
| 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. | |||
no-developer-preview |
Disallow using code which is marked as developer preview | |||
no-experimental |
Disallow using code which is marked as experimental | |||
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 |
Key
- ✅ = recommended
- 🔧 = fixable
- 💡 = has suggestions
| Rule | Description | ✅ | 🔧 | 💡 |
|---|---|---|---|---|
component-class-suffix |
Classes decorated with @Component must have suffix "Component" (or custom) in their name. Note: As of v20, this is no longer recommended by the Angular Team. | |||
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. Note: As of v20, this is no longer recommended by the Angular Team. | |||
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/guide/components/outputs#choosing-event-names | ✅ | ||
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. |
|||
no-uncalled-signals |
Warns user about unintentionally doing logic on the signal, rather than the signal's value | 💡 | ||
pipe-prefix |
Enforce consistent prefix for pipes. | |||
prefer-inject |
Prefer using the inject() function over constructor parameter injection | ✅ | ||
prefer-on-push-component-change-detection |
Ensures component's changeDetection is set to ChangeDetectionStrategy.OnPush
|
💡 | ||
prefer-output-emitter-ref |
Use OutputEmitterRef instead of @Output()
|
|||
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. | |||
sort-keys-in-type-decorator |
Ensures that keys in type decorators (Component, Directive, NgModule, Pipe) are sorted in a consistent order | 🔧 | ||
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 |
✅ | 🔧 |