Nx
WebStorm は、コードスキャフォールディング、モジュール境界の強制、自動更新、キャッシュやディストリビューション対応の高度な CI 機能を備えた、モノレポに最適化された Nx ビルドシステムと統合されます。
WebStorm は、スクリプトの実行やデバッグのための専用の Nx コンソール ツールウィンドウおよび Nx 実行/デバッグ構成を提供します。
テストに Karma を使用している場合は、 Karma 実行 / デバッグ構成で Nx パッケージを Karma パッケージとして指定することもできます。
始める前に
コンピューターに Node.js(英語) があることを確認してください。
JetBrains マーケットプレイスからプラグインをインストールする説明に従って、 設定 | プラグイン ページの マーケットプレース タブに Nx コンソールプラグインをインストールして有効にします。
NX ワークスペースを作成する
ようこそ 画面で 新規プロジェクト をクリックするか、メインメニューから を選択します。 新規 プロジェクト ダイアログが開きます。
左側のペインで、 Nx を選択します。
右側のペインで：
プロジェクト関連ファイルが保存されるフォルダーへのパスを指定します。
ノードランタイム フィールドで使用する Node.js ランタイムを指定します。 リストから設定済みのランタイムを選択するか、 追加 を選択して新しいランタイムを設定してください。
コマンド リストから npx 作成 nx ワークスペース @latest を選択してください。
作成 をクリックし、ウィザードの質問に答えます。 これらの回答に基づいて、ワークスペースが作成および設定されます。
リンクをクリックすると認証ページに移動します。
Nx コンソールツールウィンドウ
Nx コンソール ツールウィンドウには、ワークスペースに関する情報が表示されます。 すべてのプロジェクトと、それらに対して実行できる build、 serve、 test、 lint などのターゲット、および設定した構成が一覧表示されます。
ターゲットのコンテキストメニューから、ターゲットを実行またはデバッグしたり、ターゲット専用の実行 / デバッグ構成を編集したりできます。
Nx コンソール ツールウィンドウを開くには、サイドバーの
表示されているプロジェクトとターゲットのリストを表示するには、ツールウィンドウのツールバーで ワークスペースをリフレッシュ をクリックするか、
をクリックします。
Nx ターゲットの実行とデバッグ
Nx コンソール ツールウィンドウから、または専用の Nx 実行 / デバッグ構成を介して、Nx ターゲットを実行およびデバッグできます。
ターゲットの実行
Nx コンソール ツールウィンドウでターゲットを選択し、コンテキストメニューから 「<target_name>」を実行； を選択します。
ツールバーの 実行 ウィジェットから、ターゲットの名前を持つ構成を選択し、その横にある
をクリックします。
デバッグターゲット
必要に応じてスクリプトにブレークポイントを設定します。
Nx コンソール ツールウィンドウでターゲットを選択し、コンテキストメニューから 「<target_name>」をデバッグ； を選択します。
または、ツールバーの 実行 ウィジェットから、ターゲットの名前を持つ構成を選択し、その横にある
をクリックします。
ターゲットの実行 / デバッグ構成を編集する
次のいずれかを実行します：
Nx コンソール ツールウィンドウでターゲットを選択し、コンテキストメニューから '<target_name> を編集 を選択します。
メインツールバーの 実行 ウィジェットから 実行構成の編集 を選択し、リストから適切な構成を選択します。
実行 / デバッグ構成の編集: <ターゲット name> ダイアログが開きます。
デフォルトの自動生成された設定を更新し、実行 / デバッグ構成を保存します。