Migrating from tslint (of an old project) to eslint - Angular Project

Since TSLint is no longer maintained, it’s time for us to migrate to ESLint, especially if you’re working with TypeScript or Angular projects. Don’t worry, it’s quite straightforward if you use the tslint-to-eslint-config tool. Let me show you how to do it quickly.

Migrate Using tslint-to-eslint-config

1. Install the tslint-to-eslint-config Tool:

First things first, you need to install the tslint-to-eslint-config tool. You can install it globally or just within your project.

npm install -g tslint-to-eslint-config

Or, if you prefer to keep things local:

npm install --save-dev tslint-to-eslint-config

2. Conversion Command 

let’s use the tool to convert your TSLint config to ESLint. This command will create a new .eslintrc.js file for you, no need to worry.

npx tslint-to-eslint-config

3. Check the Generated ESLint Config

Open up the new .eslintrc.js file and take a look. The tool does most of the work for you, but sometimes you might need to tweak a few things yourself.

4. Install ESLint and Plugins

Install necessary plugins (you may not have it until now)

npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin 

5. Update Your angular.json

Don’t forget to update the angular.json file to use ESLint instead of TSLint. Just change the lint builder to something like below

	
		{
  "projects": {
    "your-project-name": {
      "architect": {
        "lint": {
          "builder": "@angular-eslint/builder:lint",
          "options": {
            "lintFilePatterns": ["src/**/*.ts", "src/**/*.html"]
          }
        }
      }
    }
  }
}
	

 6. Run ESLint to Check Everything

time to run ESLint and see if everything is okay, fix any problem that listed by it and your code would be soon clean & clear.

npx eslint . --ext .ts,.html

7. Clean Up the Old TSLint Stuff

Once everything’s good, you can delete the old tslint.json file and any TSLint dependencies you don’t need anymore.
That’s it! By using tslint-to-eslint-config, you can migrate to ESLint easily and keep your project up to date. Senang je!
Happy coding, and jangan lupa to keep your code clean!