WebStorm 2018.1 Help

Auto Import

File | Settings | Editor | General | Auto Import for Windows and Linux
WebStorm | Preferences | Editor | General | Auto Import for macOS
Ctrl+Alt+S settings


XML

Show import popupAutomatically display an import popup dialog box when typing the name of an unbound namespace.

TypeScript/JavaScript

Add ES6 imports on code completion
  • If this checkbox is selected, WebStorm automatically inserts an import statement in JavaScript code when you complete a symbol exported using ES6 exports in another project file:
  • When the checkbox is cleared, on pressing Alt+Enter WebStorm shows a pop-up that suggests to import the completed symbol:
    ws es6 autoimport off
  • Completion and auto import also work for React components, including stateless components. WebStorm properly detects them, provides code completion, and adds import statements automatically:
Add TypeScript imports automatically Select this checkbox if you want WebStorm to generate import statements in TypeScript code. Use the checkboxes below to choose when import generation will be invoked.
  • On code completion: If this checkbox is selected, WebStorm automatically inserts an import statement in TypeScript code when you complete a symbol exported in another project file.
  • With import popup: If this checkbox is selected, WebStorm shows a tooltip with an import suggestion when you place the cursor at an unresolved symbol that can be imported.
  • Unambiguous imports on the fly: Select the checkbox to have WebStorm automatically add an import statement when there are no other options to choose from.
Last modified: 11 April 2018