The new version of Angular 12 not include linters because TSLint is deprecated.
For that I'm going to put here how to add eslint in Angular 12.
Prerequisites:
- Node js -> 12.13.x/14.15.x or later minor
- npm
- angular/cli -> v12
First step:
// create project
ng new my-new-project
Second step:
// install eslint as dev dependency
npm install --save-dev eslint
// install ts rules plugin
npm i --save-dev @typescript-eslint/eslint-plugin
// install eslint parser
npm i --save-dev @typescript-eslint/parser
The next step is, add the rules of our linter:
- create new file ".eslintrc", on the root folder, with this values:
{
"parser": "@typescript-eslint/parser",
"extends": [
"plugin:@typescript-eslint/recommended",
],
"parserOptions": {
"ecmaVersion": 2021,
"sourceType": "module"
},
"rules": {
// custom rules here
}
}
Last step:
Add this script in package.json
"lint": "eslint \"**/*.{ts,tsx}\" "
For run:
npm run lint
Top comments (2)
There seems official lint support: angular.io/cli/lint now. It might be grateful if the official one could be introduced along with some further comparison with manual configuration under the hood.
FYI there is package @angular-eslint/angular-eslint that does all the magic.