Migrating from TSLint to ESLint is a pain | Problems and Solutions

A step by step guide to migrate the TSLint to ESLint for angular project using VS Code .

Table of Content
0:00​ - Introduction
1:28​ - What is Linting ?
3:09​ - Install ESLint and Typescript plugins
3:35​ - Migrate using tslint-to-eslint-config
4:08​ - Review migration
6:16​ - Install additional plugins
7:30​ - Update package.json file
8:02​ - Disable few ESLint rules
10:17​ - Run ESLint to scan project for new rules
10:57​ - Auto fix linting errors
12:13​ - Install ESLint Extension in VS Code
13:18​ - TSLint cleanup
14:12​ - ESLint extension stopped working
14:39​ - Problem fixed
15:45​ - Auto fix linting formatting rules in VS Code on file save
17:31​ - Last week was very hectic

Reference Document
https://code.visualstudio.com/api/adv...

Settings to be turned off in .eslingrc.js file
"@typescript-eslint/array-type": "off",
"@typescript-eslint/unbound-method": "off",
"@typescript-eslint/no-unsafe-member-access": "off",
"@typescript-eslint/explicit-module-boundary-types": "off",
"@typescript-eslint/no-unsafe-assignment": "off",
"@typescript-eslint/no-floating-promises": "off",
"@typescript-eslint/no-unsafe-call": "off",
"@typescript-eslint/no-unsafe-return": "off"

Github link to code
https://github.com/webtrainer-in/HSPA...

To enable auto format on save as per ESLINT, you can add below line in settings.json file available in .vscode folder

{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"eslint.validate": ["typescript"],
"[typescript]": {
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
}
}

Ask any question on
https://studymash.com/angular-with-we...