自動インポート
WebStorm は、モジュール、クラス、コンポーネント、エクスポート可能なその他のシンボル、および XML 名前空間のインポート文を自動的に追加します。 詳細については、 JavaScript で自動インポート、 TypeScript での自動インポート、 XML 名前空間のインポートを参照してください。
不足しているインポート文は、 シンボルを補完させる際にその場で追加することも、後で クイックフィックスやインテンションアクション、または 自動インポートのツールチップを使用して追加することもできます。
不足しているインポート文は、シンボルの作成時にその場で追加することも、後からクイックフィックスやインテンションアクション、または自動インポートツールチップを使用して追加することもできます。
ES6 シンボルまたは CommonJS モジュールの場合、WebStorm はインポート文のスタイルを自動で決定するか、必要なスタイルを選択できるポップアップを表示します。 詳しくは JavaScript で自動インポートを参照してください。
コード補完にインポートステートメントを追加する
エクスポートされた JavaScript や TypeScript のシンボルを補完すると、WebStorm はインポートステートメントを追加します。
補完時の自動インポートを設定
完了時に自動インポートを無効にして、代わりにクイックフィックスを使用することができます。
設定 ダイアログ（Ctrl+Alt+S ）で に移動します。
開いた 自動インポート ページで、 TypeScript/JavaScript 領域のチェックボックスを使用して、コード補完でのインポート生成を有効または無効にします。
クイックフィックスを使用する
WebStorm には、インポート文が不足している場合や自動インポートが無効になっている場合に、インポート文を追加するためのクイックフィックスがあります。
WebStorm はシンボルを未解決としてマークし、推奨されるクイックフィックスを含むポップアップを表示します：
または、 Alt+Enter を押します。
インポート元となる候補が複数ある場合、WebStorm は候補リストを表示します：
import ステートメントの欠落 警告を表示したくない場合は、現在のファイルまたはプロジェクト全体でインスペクションを無効にします。 詳細については、 インスペクションの無効化と有効化 を参照してください。
または、ファイルの ハイライトレベルを変更するには、エディター右上のウィジェットにカーソルを合わせ、 なし または 構文 を ハイライト リストから選択してください。
自動インポートツールチップを使ってインポートステートメントを追加する
インポート文が見つからないシンボルにカーソルを合わせると、自動インポートのツールチップが表示されます。 提案を受け入れるには、 Alt+Enter を押してください。
ツールチップを無効にするには、エディターの右上隅にあるインスペクションウィジェットにカーソルを合わせ、 
をクリックして、 自動インポートツールチップを表示 オプションのチェックを外します。
インポートの最適化
WebStorm は、未使用のインポートの削除や、現在のファイル、ディレクトリ内すべてのファイル、またはプロジェクト全体を一度にインポートステートメントを整理するのに役立ちます。
すべてのインポートを最適化する
プロジェクト ツールウィンドウ（ ）でファイルまたはディレクトリを選択します。
以下のいずれかを行います：
に移動します（または Ctrl+Alt+O を押します）。
コンテキストメニューから インポートの最適化 を選択します。
（ディレクトリを選択した場合）ディレクトリ内のすべてのファイルでインポートを最適化するか、ローカルで変更されたファイルのみでインポートを最適化するか（プロジェクトがバージョン管理下にある場合）を選択し、 実行 をクリックします。
1 つのファイルでインポートを最適化する
import ステートメントにキャレットを置き、 Alt+Enter を押すか、
アイコンを使用します。 次に 未使用の 'import' を除去 を選択します。
エディターでファイルを開くか、 プロジェクト ツールウィンドウでファイルを選択し、 Ctrl+Alt+O を押します。
ファイルの整形時にインポートを最適化する
再フォーマットごとにファイル内のインポートを最適化するよう、WebStorm に指示できます。
エディタでファイルを開き、 Ctrl+Alt+Shift+L を押して、開いた ファイルの整形 ダイアログで インポートの最適化 チェックボックスが選択されていることを確認します。
その後、このプロジェクトで Ctrl+Alt+L を押すたびに、WebStorm はインポートを自動的に最適化します。
VCS に変更をコミットする前にインポートを最適化する
プロジェクトがバージョン管理下にある場合、変更されたファイルを VCS にコミットする前に、WebStorm にインポートを最適化するよう指示できます。
コミット ツールウィンドウ Alt+0 で、
をクリックし、 コミットチェック 領域の > インポートの最適化 チェックボックスを選択します。
モーダルモードの場合は、 Ctrl+K を押して 変更のコミット を開き、 インポートの最適化 チェックボックスを選択します。
更新されたコードでのみインポートを最適化することもできます。 プロジェクト ツールウィンドウで、フォルダーを選択し、 Ctrl+Alt+O を押します。 インポートの最適化 ダイアログで VCS 変更されたファイルのみ処理する を選択し、 実行 をクリックします。
保存時にインポートを自動的に最適化する
変更が保存されたときに、変更されたファイルへのインポートを自動的に最適化するように IDE を構成できます。
Ctrl+Alt+S を押して設定を開き、 を選択します。
インポートの最適化 オプションを有効にして、変更を適用します。
さらに、 すべてのファイルタイプ リストから、自動インポート最適化を使用するファイルのタイプを選択します。
インポート文のスタイルを設定する
JavaScript または TypeScript インポートのスタイルを構成するには、 設定 ダイアログ (Ctrl+Alt+S) を開き、 または に移動し、 インポート タブのコントロールを使用してインポートステートメントの外観をカスタマイズします。 詳細については、 JavaScript コードスタイル: インポートおよび TypeScript コードスタイル: インポートを参照してください。
終了セミコロン、一重引用符と二重引用符、末尾のコンマの自動挿入を構成するには、 設定 ダイアログ (Ctrl+Alt+S) を開き、 または に移動し、 句読点 タブのコントロールを使用します。 詳細については、 JavaScript コードスタイル: 句読点および TypeScript コードスタイル: 句読点を参照してください。
CSS、SCSS、Less のコンテキストでは、WebStorm はデフォルトで、
importステートメントおよび URL の生成された文字列リテラルに二重引用符を使用します。 一重引用符を使用するには、 設定 ダイアログ (Ctrl+Alt+S) を開き、 に移動し、 その他 タブを開いて、 引用符 リストから 単一 を選択します。再フォーマット後に選択したスタイルをファイル全体に適用するには、リストの 整形時に強制する チェックボックスを選択します。