WebStorm automatically adds import statements for modules, classes, components, and any other symbols that can be exported and called as a type, as well as for XML namespaces. Learn more from Auto import in TypeScript and Importing an XML namespace.
Add import statements on code completion
WebStorm adds missing import statements when you complete ES6 or TypeScript symbols.
You can disable auto import on completion and use quick-fixes instead:
- In the Settings/Preferences dialog (Ctrl+Alt+S), click General under editor, and then click Auto Import. The Auto Import page opens.
Use a quick-fix
WebStorm marks the symbol as unresolved and shows a tooltip: On pressing Alt+Enter, WebStorm displays the suggested quick-fix: If there's more than one possible source of import, WebStorm shows a list of suggestions:
Add import statements using the import popup
In TypeScript, WebStorm shows you an import popup. To accept the suggestion, press Alt+Enter:
WebStorm helps you remove unused imports and organize import statements in the current file, in all files in a directory, or in the entire project at once.
Optimize imports in a file
- Open the file in the editor or select it in the Project tool window and press Ctrl+Alt+O.
Optimize imports when reformatting a file
You can tell WebStorm to optimize imports in a file every time it is reformatted.
- Open the file in the editor, press Ctrl+Shift+Alt+L, and make sure the Optimize imports checkbox is selected in the Reformat File dialog that opens. After that every time you press Ctrl+Alt+L in this file, WebStorm will optimize its imports automatically.
Optimize imports in a folder
- Select the folder in the Project tool window, press Ctrl+Alt+O, and click Run in the Optimize Imports dialog that opens.
Optimize imports only in modified code
If your project is under version control, you can optimize imports only in the updated code. You can also instruct WebStorm to optimize imports in modified files before committing them to VCS.
- In the Project tool window, select a folder, and press Ctrl+Alt+O. In the Optimize imports dialog, select the Process only VCS changed files and click Run.
- In the Commit Changes Dialog (Ctrl+K), select the Optimize imports checkbox.