Value in Cleaning up unneeded import statements Typescript/Angular

Question

Visual Code nicely displays unused imports:

Would having a junior developer/intern go through and remove all unused imports and a relatively decent sized Angular 7 have any benefit other than code tidiness?

Is it possible app size/performance could be improved?

In which case, something like this should make _literally_ zero difference. — jhpratt, Feb 06 '19 at 02:37
To have this done automatically, try tslint-etc's `no-unused-declaration` ref https://stackoverflow.com/a/57420207/5499369 — Mark Leong, Aug 20 '19 at 08:52

mwilson · Accepted Answer · 2019-02-06T02:41:33.557

It's really up to you and what you prefer. If you leave them in there and are using angular AOT compilation, Tree Shaking is done. You can read more about that process here (https://angular.io/guide/aot-compiler)

One other option (to prevent people from doing this) is to enable the no-unused-variable in your tslint.json. This enables your TypeScript Linter to disallow unused imports:

Disallows unused imports, variables, functions and private class members. Similar to tsc’s –noUnusedParameters and –noUnusedLocals options, but does not interrupt code compilation.

https://palantir.github.io/tslint/rules/no-unused-variable/

I personally would just enable the tslint rule, run the linter, figure out how many references are unused and then determine if it's worth having someone go through all those lint errors and fix them.

score 3 · Answer 2 · answered Aug 22 '19 at 09:20

Here are two solutions to different phases:

At code writing phase

You can use the code editor feature to remove the unused import variables. e.g. vscode provide a feature run-code-actions-on-save

Add below config in your settings.json file of vscode:

{
  "[typescript]": {
    "editor.codeActionsOnSave": {
      "source.organizeImports": true
    }
  }
}

It will remove the unused import variables and organize your import statement.

At compiler phase

Like @mwilson said, tsc, aot compilation or webpack and do this kind of job.

Value in Cleaning up unneeded import statements Typescript/Angular

2 Answers2