How to run @angular-eslint/schematics:convert-tslint-to-eslint

8
votes

I'm trying to switch an Angular project from TSLint to ESLint, following the instructions in angular-eslint Github repo.

I ran ng add @angular-eslint/schematics which added the following dependencies to my package.json:

    "@angular-eslint/builder": "1.2.0",
    "@angular-eslint/eslint-plugin": "1.2.0",
    "@angular-eslint/eslint-plugin-template": "1.2.0",
    "@angular-eslint/schematics": "1.2.0",
    "@angular-eslint/template-parser": "1.2.0",
    "@typescript-eslint/eslint-plugin": "4.3.0",
    "@typescript-eslint/parser": "4.3.0",
    "eslint": "7.6.0",
    "eslint-plugin-import": "2.22.1",
    "eslint-plugin-jsdoc": "30.7.6",
    "eslint-plugin-prefer-arrow": "1.2.2",

Also, ran npm install to ensure these are all installed.

Now I'm instructed to run:

ng g @angular-eslint/schematics:convert-tslint-to-eslint --remove-tslint-if-no-more-tslint-targets --ignore-existing-tslint-config

However, this results in errors:

Unknown option: '--remove-tslint-if-no-more-tslint-targets'
Unknown option: '--ignore-existing-tslint-config'

When I remove these options, I get another error:

Invalid rule result: Instance of class Promise.

It seems like this angular-eslint schematic was not installed properly. However, I'm a complete novice regarding these schematics. I must be missing something obvious here.

Using @angular/cli 10.2.3.

3
angulareslinttslintangular-schematics

3 Answers

1
votes

It depends on the Angular version of your project because it install a different version of @angular-eslint/schematics for different angular versions

Steps will be:

A. Add @angular-eslint to your project:

ng add @angular-eslint/schematics

B.If you have an Angular 12 project, you’re done! For Angular 11, run the following:

ng g @angular-eslint/schematics:convert-tslint-to-eslint --remove-tslint-if-no-more-tslint-targets

(Use: --ignore-existing-tslint-config flag only if you want to ignore old tslint configuration)

If you are on Angular 9 or 10, an older version of the schematic gets installed and the convert command differs slightly. You may want to prioritize upgrading Angular before converting to ESLint. But if you really want to upgrade linting first, use this command:

ng g @angular-eslint/schematics:convert-tslint-to-eslint <project-name-here>

Detailed blog for tslint to eslint migration

0
votes

If you're migrating an existing project then you should run either

ng g @angular-eslint/schematics:convert-tslint-to-eslint

or

ng g @angular-eslint/schematics:convert-tslint-to-eslint {{YOUR_PROJECT_NAME_GOES_HERE}}

instead of

ng g @angular-eslint/schematics:convert-tslint-to-eslint --remove-tslint-if-no-more-tslint-targets --ignore-existing-tslint-config

as per the guidelines https://github.com/angular-eslint/angular-eslint#step-2---run-the-convert-tslint-to-eslint-schematic-on-a-project

0
votes

Try running the following commands and see if it works:

npm install @schematics/angular@latest -g  
remove node_modules 
remove package-lock.json    
npm install