Is there a way to remove unused imports and declarations from Angular 2

Question

I m assigned to take some messed code from other developers who have already left the company recently   I am curiously asking is there some plug-in of Visual Studio Code or other means that could help us to tidy and organize the imports and references quickly and effectively   For example  there are maybe hundreds of imports like this  import   AutoCompleteModule InputSwitchModule   from  primeng primeng   import   ListboxModule   from  primeng primeng     could be converted to similarily  import   AutoCompleteModule           InputSwitchModule           ListboxModule    from  primeng primeng     Or other functions like automatically removing those unused imports and declarations from the app module or from all components through the whole project   Thanks for any feedback

User · Accepted Answer

Edit  as suggested in comments and other people   Visual Studio Code has evolved and provides this functionality in-built as the command  Organize imports   with the following default keyboard shortcuts   option Shift O for Mac   Alt     Shift    O for Windows    Original answer   I hope this visual studio code extension will suffice your need  https   marketplace visualstudio com items itemName rbbit typescript-hero  It provides following features    Add imports of your project or libraries to your current file Add an import for the current name under the cursor Add all missing imports of a file with one command Intellisense that suggests symbols and automatically adds the needed imports  Light bulb feature  that fixes code you wrote Sort and organize your imports  sort and remove unused  Code outline view of your open TS   TSX document All the cool stuff for JavaScript as well   experimental stage though  better description below     For Mac  control option o  For Win  Ctrl Alt o

User · Answer

As of Visual Studio Code Release 1 22 this comes free without the need of an extension   Shift Alt O will take care of you

User · Answer

There are already so many good answers on this thread  I am going to post this to help anybody trying to do this automatically  To automatically remove unused imports for the whole project this article was really helpful to me    In the article the author explains it like this   Make a stand alone tslint file that has the following in it        extends     tslint-etc       rules          no-unused-declaration   true         Then run the following command to fix the imports    tslint --config tslint-imports json --fix --project     Consider fixing any other errors it throws   I did   Then check the project works by building it   ng build   or  ng build name of project --configuration production    End  If it builds correctly  you have successfully removed imports automatically   NOTE  This only removes unnecessary imports  It does not provide the other features that VS Code does when using one of the commands previously mentioned

User · Answer

To be able to detect unused imports  code or variables  make sure you have this options in tsconfig json file   compilerOptions          noUnusedLocals   true       noUnusedParameters   true     have the typescript compiler installed  ifnot install it with   npm install -g typescript   and the tslint extension installed in Vcode  this worked for me  but after enabling I notice an increase amount of CPU usage  specially on big projects   I would also recomend using typescript hero extension for organizing your imports

User · Answer

If you re a heavy visual studio user  you can simply open your preference settings and add the following to your settings json        editor formatOnSave   true   editor codeActionsOnSave        source organizeImports   true          Hopefully this can be helpful

User · Answer

Since VSCode v 1 24 and TypeScript v 2 9    For Mac  option Shift O  For Win  Alt Shift O

[angular] Is there a way to remove unused imports and declarations from Angular 2+?

Examples related to angular

Examples related to visual-studio-code