Auto fix TSLint Warnings

Question

    [64, 1]: space indentation expected
    [15, 27]: Missing semicolon
    [109, 36]: missing whitespace
    [111, 24]: missing whitespace
    [70, 1]: Consecutive blank lines are forbidden

I keep getting warnings like these from TSLint. There are huge amount of warnings, and it will be very difficult to fix it manually.

I was looking for a way which can auto-fix most of the warnings.

Answer 1

You can use the --fix option of TSLint to automatically fix most warnings. This might look something like this in a common use case:

tslint --fix -c ./config/tslint.json 'src/**/*{.ts,.tsx}'

Keep in mind that this will overwrite your source code. While this is safe 99.9% of the time, I recommend the following workflow:

1. Commit the changes you have made to your code
2. Run TSLint with the --fix flag like above
3. Quickly review the changes TSLint has made
4. Make a new commit with these changes, or simply amend them to your previous commit

This way, you'll never be taken surprise by a rogue autocorrection gone wrong.

Answer 2

tslint --fix --project ./tsconfig.json

这是自动修复所有错误是根文件夹

Answer 3

使用@angular/cli 你可以使用ng lint --fix

Answer 4

May be this could help some one looking for autoFix on save!

we can make tslint warnings to get autofixed on save. To do this, go to tslint.json file and add the below settings. [Note: This setting works with latest TSLint and not the deprecated one].

  "source.fixAll.tslint": true

After updating this, go to any file and try giving some spaces and it shows tslint warning message as "trailing whitespace" and when you save (Ctrl + S), this warning will get disappear. Though it appears manually, we usually tend to try saving the file once edited and by that time it will get fixed automatically.

Happy coding!

Answer 5

If you using IntelliJ Idea or WebStrom , then you can create File Watcher in Settings > Tools by the following configuration:

On save ( Ctrl + s ), your current file will be fixed.

Answer 6

If you using webpack . You can use tslint-loader:

Add this to webpack module rules:

{
    test: /\.ts$/,
    loader: 'tslint-loader',
    enforce: 'pre',
    options: {
      fix: true
    }
  }

Read more here: tslint-loader