What is @angular-eslint/utils?
@angular-eslint/utils is a utility package designed to help developers integrate ESLint with Angular projects. It provides a set of tools and utilities to facilitate linting Angular code, ensuring code quality and consistency.
What are @angular-eslint/utils's main functionalities?
Rule Creation
This feature allows developers to create custom ESLint rules tailored to their Angular projects. The code sample demonstrates how to define a custom rule that disallows a specific pattern.
const { createESLintRule } = require('@angular-eslint/utils');
module.exports = createESLintRule({
name: 'my-custom-rule',
meta: {
type: 'problem',
docs: {
description: 'Disallow certain patterns',
category: 'Best Practices',
recommended: 'error'
},
schema: [],
messages: {
forbiddenPattern: 'This pattern is not allowed.'
}
},
defaultOptions: [],
create(context) {
return {
Identifier(node) {
if (node.name === 'forbiddenPattern') {
context.report({ node, messageId: 'forbiddenPattern' });
}
}
};
}
});
AST Utilities
This feature provides utilities for working with Angular's Abstract Syntax Tree (AST). The code sample shows how to use `getTemplateParserServices` to suggest improvements for Angular templates.
const { getTemplateParserServices } = require('@angular-eslint/utils');
module.exports = {
meta: {
type: 'suggestion',
docs: {
description: 'Suggest improvements for Angular templates',
category: 'Best Practices',
recommended: 'warn'
},
schema: [],
messages: {
suggestImprovement: 'Consider improving this template.'
}
},
create(context) {
const parserServices = getTemplateParserServices(context);
return {
'Element$1'(node) {
const templateNode = parserServices.convertNodeSourceSpanToLoc(node.sourceSpan);
context.report({ node: templateNode, messageId: 'suggestImprovement' });
}
};
}
};
Other packages similar to @angular-eslint/utils
eslint-plugin-angular
eslint-plugin-angular is a plugin that provides a set of ESLint rules for AngularJS applications. It focuses on AngularJS (1.x) rather than Angular (2+), making it suitable for legacy projects. Compared to @angular-eslint/utils, it does not support modern Angular features.
eslint-plugin-angularjs
eslint-plugin-angularjs is another plugin aimed at linting AngularJS (1.x) code. It offers a variety of rules to enforce best practices and code quality in AngularJS projects. Unlike @angular-eslint/utils, it is not designed for Angular (2+) applications.
eslint-plugin-typescript
eslint-plugin-typescript provides linting rules for TypeScript codebases. While it is not specific to Angular, it can be used in conjunction with other plugins to lint TypeScript code in Angular projects. It does not offer Angular-specific utilities like @angular-eslint/utils.
@angular-eslint/utils
Please see https://github.com/angular-eslint/angular-eslint for full usage instructions and guidance.
The @angular-eslint/utils
package is a set of utility functions and types which are used across the @angular-eslint
packages and are helpful when writing your own custom ESLint rules for Angular workspaces.
20.1.0 (2025-06-16)
🚀 Features
- eslint-plugin: add rules to ban experimental and developer preview (#2037)
🩹 Fixes
- update dependency @angular/compiler to v20.0.3 (#2505)
- update dependency eslint to v9.29.0 (#2520)
- update typescript-eslint packages to v8.34.0 (#2511)
❤️ Thank You
- Daniel Kimmich @json-derulo
As always we recommend that you update your existing workspaces by using ng update
as we provide some helpful schematics to help migrate your workspaces to the latest and greatest. Running the following will update Angular, the Angular CLI and angular-eslint together:
ng update @angular/core @angular/cli angular-eslint
🚀 Features
- ⚠️ switch to angular v20 (e2b46ef4)
- ⚠️ eslint-lint: add prefer-inject to recommended (c8367d3b)
- ⚠️ eslint-plugin: switch prefer-standalone fix to suggestion, reference guide (4583034f)
- ⚠️ eslint-plugin: remove (component|directive)-class-suffix from recommended (c1022ee6)
- ⚠️ template-parser: do not suppress parse errors by default (#2255)
🩹 Fixes
- ⚠️ eslint-plugin: [sort-keys-in-type-decorator] default orders now include all known keys (9183385d)
⚠️ Breaking Changes
- ⚠️ eslint-plugin: [sort-keys-in-type-decorator] default orders now include all known keys (9183385d)
- ⚠️ switch to angular v20 (e2b46ef4)
- ⚠️ eslint-lint: add prefer-inject to recommended (c8367d3b)
- ⚠️ eslint-plugin: remove (component|directive)-class-suffix from recommended (c1022ee6)
- ⚠️ eslint-plugin: switch prefer-standalone fix to suggestion, reference guide (4583034f)
- ⚠️ template-parser: do not suppress parse errors by default (#2255)
❤️ Thank You
- Dave @reduckted
- JamesHenry @JamesHenry