WebStorm 2024.3 ヘルプ

外部ツール

コンパイラー、リンター、コード圧縮プログラムなどのサードパーティのスタンドアロンアプリケーションを使用する推奨方法は、ツール固有のファイルウォッチャーを構成することです。このファイルウォッチャーはファイルへの変更を追跡し、必要に応じてアプリケーションを自動的に実行します。詳細については、File Watchers を参照してください。

または、WebStorm でスタンドアロンのサードパーティアプリケーションを外部ツールとして構成することもできます。その結果、メインメニューと場合によってはコンテキストメニューにツール固有のコマンドが追加され、WebStorm から直接ツールを実行できるようになります。実行 / デバッグ構成の前にツールを実行するように構成することもできます。もちろん、組み込みのターミナル Alt+F12 から実行することもできます。

WebStorm を使用すると、プロジェクトから外部ツールにコンテキスト情報をコマンドライン引数 (現在選択されているファイルや sourcemap ディレクティブなど) として渡し、ツールによって生成された出力を表示できます。

WebStorm は、次のタイプの外部ツールをサポートしています。

  • ローカルツールは、コンピューター上でローカルに実行されます。

  • リモートツールは SSH を介してリモートサーバー上で実行されます。

ローカル外部ツールを追加する

この例は、ImageOptim(英語) を外部ツールとして追加し、それを使用してプロジェクト内のイメージを最適化する方法を示しています。

  1. Ctrl+Alt+S を押して設定を開き、ツール | 外部ツールを選択します。

  2. the Add button をクリックし、ツールの設定を指定します。

    The Create Tool dialog

    詳細は、外部ツールを参照してください。

    この場合、ImageOptim-o4 $FilePath$ 引数を使用して実行されます。プロジェクト名や現在のファイルパスなどを参照できるマクロを使用できます。the Insert Macros icon をクリックすると、使用可能なすべてのマクロとその値をリストするマクロダイアログが開きます。

  3. OK をクリックしてツールを追加してから変更を適用します。

追加されたローカル外部ツールを実行する

新しく追加されたツールイメージで選択したファイルを開くには、次のいずれかを実行します。

  • ツール | 外部ツール | アプリでイメージを最適化するに移動します。

  • プロジェクトツールウィンドウでファイルを右クリックして、コンテキストメニューから外部ツール | アプリでイメージを最適化するを選択します。

    Run External tool
  • ツールを実行するためのショートカットを作成します。

    Ctrl+Alt+S を押して設定を開き、キーマップを選択します。外部ツールノードにあるアプリでイメージを最適化するアクションを見つけて、ショートカットを割り当てます。

    Create a shortcut for an external tool
  • ツールバーからツールを実行するためのアイコンを追加します。

    1. Ctrl+Alt+S を押して設定を開き、外観 & 振る舞い | メニューおよびツールバーを選択します。

    2. 使用可能なメニューとツールバーのリストで、メインツールバーノードを展開し、イメージオプティマイザーアイコンを追加する項目を選択して、追加をクリックします。

    3. 開いたダイアログで、外部ツール | イメージ最適化を選択し、アイコンフィールドでそれを示すアイコンを指定し、準備ができたらアイコンの設定をクリックします。

      Create external tool: add an icon to the toolbar

    アイコンがツールバーに表示されます。

    Create external tool: the toll's icons added to the toolbar

ツールを実行すると、出力が実行ツールウィンドウに表示されます。

リモート外部ツールを追加する

リモート SSH 外部ツールはローカル外部ツールと同様に構成されますが、実行されるリモートサーバーも定義し、SSH 経由で接続するための資格情報を必要とします。組み込み SSH ターミナルの使用方法の詳細については、「SSH ターミナルを実行する」を参照してください。

  1. Ctrl+Alt+S を押して設定を開き、ツール | リモート SSH 外部ツールを選択します。

  2. the Add button をクリックしてツールの作成ダイアログを開きます。

    このダイアログでは、ローカル外部ツールを追加するときと同じ設定セットが提供されますが、リモート接続を選択することもできます。接続設定を指定しない場合、WebStorm はサーバー上でツールを実行するたびに、ホスト、ポート、関連する SSH 資格情報を要求します。詳細については、リモート SSH 外部ツールを参照してください。

  3. OK をクリックしてツールを追加してから変更を適用します。

追加されたツールをリモートサーバーで実行する

以下のいずれか 1 つを実行します:

  • メインメニューで、ツール | リモートツールと追加されたリモート外部ツールの名前に移動します。

  • ツールを実行するためのショートカットを作成します。

    Ctrl+Alt+S を押して設定を開き、キーマップを選択します。設定したリモート外部ツールの名前のアクションを見つけて、ショートカットを割り当てます。

ホスト、ポート、資格情報を指定すると、WebStorm は SSH 経由でサーバーに接続してコマンドを実行し、WebStorm の実行ツールウィンドウに出力を返します。

関連ページ:

File Watchers

File Watcher は、ファイルの変更を追跡し、サードパーティのスタンドアロンアプリケーションを実行する WebStorm システムです。WebStorm は、多数の標準的な一般的なサードパーティツール (コンパイラー、コンプレッサー、整形ツールなど) 用に定義済みの File Watcher テンプレートを提供します。カスタム File Watcher を設定して、他のサードパーティツールを実行することもできます。File Watchers には 2 つの専用コードインスペクションがありま...

外部ツール

このページでは、ローカル外部ツールに対して構成できる設定について説明します。外部ツールの追加と使用の詳細については、「外部ツール」を参照してください。ツールバーボタンを使用して、使用可能な外部ツールのリストを管理します。保持したいがメニューで使用できないツールとグループのチェックボックスをオフにします。追加新しい外部ツールを追加します。除去選択したツールまたはグループを削除します。編集選択したツールを編集します。上へ選択したツールをリスト内で上に移動します。

組み込みの IDE マクロ

WebStorm は、外部ツールや実行構成のさまざまなパス、オプション、その他のコマンドライン引数を指定するために使用できる変数である、多数の組み込みマクロを提供します。値としてマクロを受け入れるダイアログフィールドには、プラスアイコンが表示されます。マクロの値は現在のコンテキストによって異なります。例: 現在のファイルを含むディレクトリの名前を渡す必要がある場合は、完全なパスが必要な場合はを使用します。現在のプロジェクトが属するワークスペースへのパス。ワークスペースは、開いているファイル階層の...

リモート SSH 外部ツール

このページでは、リモート外部ツールで行うことができる設定について説明します。外部ツールの追加と使用の詳細については、「外部ツール」を参照してください。ツールバーボタンを使用して、使用可能な外部ツールのリストを管理します。保持したいがメニューで使用できないツールとグループのチェックボックスをオフにします。追加新しい外部ツールを追加します。除去選択したツールまたはグループを削除します。編集選択したツールを編集します。上へ選択したツールをリスト内で上に移動します。

シェルスクリプト

シェルスクリプトプラグインを有効にするこの機能は、デフォルトで WebStorm にバンドルされて有効になっているシェルスクリプトプラグインに依存しています。関連する機能が利用できない場合は、プラグインを無効にしていないことを確認してください。を押して設定を開き、を選択します。インストール済みタブを開き、シェルスクリプトプラグインを見つけて、プラグイン名の横にあるチェックボックスを選択します。WebStorm は、シェルスクリプトファイルのコーディング支援を提供します: 補完(ローカルパスを含む)...