Node.js と Docker
Docker を使用すると、Node.js アプリケーションをすばやくブートストラップして、IntelliJ IDEA から実行、デバッグ、プロファイリングできます。IDE は、新しい Dockerfile を自動的に作成し、イメージをビルドして実行し、ソースコードを同期し、コンテナーに npm 依存関係をインストールすることにより、初期構成を処理します。
WebStorm と Docker のクイックツアー(英語)でいくつかの例を見つけることができます。
始める前に
設定 | プラグインページのインストール済みタブで、JavaScript and TypeScript、JavaScript Debugger、Node.js、Node.js リモートインタープリター、Docker の必須プラグインが有効になっていることを確認します。詳細については、プラグインのマッピングを参照してください。
JetBrains マーケットプレイスからプラグインをインストールする説明に従って、設定 | プラグインページのマーケットプレースタブに Node.js リモートインタープリタープラグインをインストールして有効にします。
Docker の説明に従って、Docker をダウンロード、インストール、設定します。
Docker で Node.js インタープリターを構成する
Docker の Node.js インタープリターは、Node.js リモートインタープリターの構成ダイアログで構成されます。このダイアログは、Docker でアプリケーションを実行またはデバッグするために Node.js の実行 / デバッグ構成を作成または編集するを実行するときに、設定ダイアログの Node.js ページから開くことができます。
推奨される方法は、設定ダイアログでリモート Node.js インタープリターを構成することです。この場合、プロジェクトのデフォルトとしてインタープリターと関連するパッケージマネージャーを設定できます。その結果、Docker で構成された Node.js インタープリターを使用してアプリを実行およびデバッグできるだけでなく、プロジェクトの依存関係を管理し、テストを実行し、コードをリントすることもできます。以下の npm、pnpm、yarn と Docker、アプリケーションをテストする、Docker を使用した ESLint を参照してください。
Node.js の実行 / デバッグ構成で直接構成するリモート Node.js インタープリターは、この実行 / デバッグ構成でのみ使用できます。
リモート Node.js インタープリターを作成する
設定ダイアログ(Ctrl+Alt+S)を開き、 に移動します。
Node インタープリターフィールドの横にある をクリックします。
現在構成されているすべてのインタープリターのリストが表示された Node.js インタープリターダイアログで、ツールバーの をクリックし、コンテキストメニューからリモートの追加を選択します。
開いた Node.js リモートインタープリターの構成ダイアログで、Docker を選択します。
サーバーリストから、使用する Docker 構成を選択します。
または、フィールドの横にある新規をクリックし、Docker サポートを有効にする説明に従って Docker サーバーを構成します。
イメージ名: リストから、使用するイメージを選択します。
Node.js 実行可能ファイルは自動的に検出され、Node.js インタープリターのパスフィールドに表示されます。
OK をクリックして、新しいインタープリターがリストに追加される Node.js インタープリターダイアログに戻ります。
新しく構成されたインタープリターをプロジェクトのデフォルトとして設定するには、リストでインタープリターを選択し、OK をクリックして Node.js ダイアログに戻ります。
IntelliJ IDEA は、たとえば実行 / デバッグ構成を作成するときに、Node インタープリターリストから
Project
エイリアスを選択するたびに、このインタープリターを自動的に使用します。新しいインタープリターに関連付けられたパッケージマネージャーを使用してプロジェクトの依存関係を管理するには、このパッケージマネージャーをプロジェクトのデフォルトとして設定します。これを行うには、パッケージマネージャーフィールドでパッケージマネージャーの場所を指定します。デフォルトのプロジェクト Node.js インタープリターとパッケージマネージャーを指定するから詳細を参照してください。
デフォルトのプロジェクト Node.js インタープリターとパッケージマネージャーを指定する
IntelliJ IDEA は、実行 / デバッグ構成の作成時など、Node インタープリターリストから Project
エイリアスを選択するたびに、デフォルトのプロジェクトインタープリターを自動的に使用します。
デフォルトのプロジェクトパッケージマネージャーは、依存関係を管理するために自動的に使用されます。たとえば、package.json ファイルから <package manager> install
を実行したり、ESLint、Prettier などのサードパーティツールをインストールしたりします。
設定ダイアログ(Ctrl+Alt+S)を開き、 に移動します。
Node インタープリターリストから、現在のプロジェクトでデフォルトで使用する構成を選択します。
パッケージマネージャーリストから、使用するパッケージマネージャーに関連付けられているエイリアスを選択します。IntelliJ IDEA はその位置を自動的に検出します。
または、必要なパッケージマネージャーの場所を手動で指定します。
npm 実行可能ファイルのデフォルトの場所は
/usr/local/lib/node_modules/npm
です。pnpm のデフォルトの場所は、インストール方法によって異なります。
npm を介してインストールするための /usr/local/lib/node_modules/pnpm。
カールを介してインストールするための /usr/local/pnpm-global/<version>/node_modules/pnpm(
curl -f https://get.pnpm.io/<version>.js | node - add --global pnpm
)。
詳細については、pnpm の公式 Web サイト(英語)を参照してください。
ヤーンのデフォルトの場所は /opt/yarn-<version>5 で、たとえば /opt/yarn-v1.22.5 です。
npm、pnpm、yarn と Docker
IntelliJ IDEA を使用すると、ローカルプロジェクトの場合と同じように、プロジェクトの依存関係を管理し、Docker コンテナーでスクリプトを実行できます。
Docker のリモート Node.js インタープリターが構成されていることを確認してください。
プロジェクトの依存関係を管理します。
package.json ファイルを開き、ローカル開発と同様に続行します。たとえば、コンテキストメニューから実行 '<package manager> install' を選択します。依存関係は、Docker コンテナー内のデフォルトのパッケージマネージャーを使用してインストールされ、node_modules フォルダーがプロジェクトに表示されます。
または、組み込みターミナル(Alt+F12)を開き、必要なパッケージを手動でインストールします。たとえば、
npm install --save-dev eslint
を実行します。
パッケージのインストールと更新と package.json を編集する詳細を参照してください。
Node.js 実行構成を作成する
構成の編集ダイアログで、ツールバーの をクリックし、コンテキストメニューから Node.js を選択します。「実行 / デバッグ構成: Node.js」ダイアログが開きます。
に進みます。開いたファイルフィールドで、それを開始するアプリケーションのメインファイルへのパスを指定します(たとえば、Express(英語) アプリケーションの場合は bin/www)。
必要に応じて、Node.js アプリケーションの実行とデバッグで説明されているいくつかのオプション設定を指定します。
Node インタープリターリストから、Docker 環境で関連するリモート Node.js インタープリターを選択します。
または、Node インタープリターフィールドの横にある をクリックし、上記のようにリモート Node.js インタープリターを構成します。
Docker コンテナーの設定フィールドのポートとボリュームのバインディング値を確認してください。
アプリケーションを実行する
上記のように Node.js 実行 / デバッグ構成を作成します。
ツールバーの実行 / デバッグ構成を選択リストから、新しく作成された Node.js 構成を選択します。
をクリックして実行 / デバッグ構成を選択リストに移動します。
アプリケーションの出力を確認する
アプリケーションが期待どおりに機能することを確認するために、IntelliJ IDEA 組み込みの HTTP クライアントから HTTP リクエストを実行できます。
HTTP リクエストファイルを作成します。
次のリクエストを書いてください。
GET http://<host IP>:<container port>/例:
GET http://127.0.0.1:3010/ガターの をクリックし、http://< を実行 ; ホスト IP>:<コンテナー port>/ の横にある をクリックします。
アプリケーションの出力は、実行ツールウィンドウの別のタブに表示されます。
アプリケーションをデバッグする
アプリケーションをテストする
IntelliJ IDEA を使用すると、ローカルで実行するのと同じ方法で、Mocha(英語) テストと Jest(英語) テストを Docker コンテナー内で実行できます。詳細については、「Mocha および Jest」を参照してください。
Docker の関連するリモート Node.js インタープリターが構成され、プロジェクトのデフォルトとして選択されていることを確認してください。また、このリモートインタープリターに関連付けられたパッケージマネージャーがプロジェクトのデフォルトとして設定されていることを確認してください。詳細については、Docker で Node.js インタープリターを構成するおよび npm、pnpm、yarn と Docker を参照してください。
package.json を開き、必要なテストフレームワークが
devDependencies
セクションにリストされていることを確認します。{ "name": "node-express", "version": "0.0.0", "private": true, "dependencies": { "cookie-parser": "~1.4.4", "debug": "~2.6.9", "express": "~4.16.1", "http-errors": "~1.6.3", "morgan": "~1.9.1", "pug": "^3.0.2" }, "devDependencies": { "chai": "^4.3.4", "concurrently": "^6.3.0", "eslint": "^8.1.0", "http-server": "^14.0.0", "jest": "^27.3.1", "mocha": "^9.1.3", "nyc": "^15.1.0" } }エディターの任意の場所を右クリックして、コンテキストメニューから実行 '<package manager> install' を選択します。
Mocha オフィシャル Web サイト(英語)または Jest オフィシャル Web サイト(英語)の指示に従ってテストを作成します。
ユニットテストが保存されているフォルダーをテストソースフォルダーとしてマークします(コンテンツルートを参照)。
Mocha テストの実行、Mocha テストのデバッグ、Jest テストの実行、Jest テストのデバッグに従って、エディターから直接単一のテストを実行およびデバッグするか、実行 / デバッグ構成を作成して、テストの一部またはすべてを起動します。
Docker を使用した ESLint
IntelliJ IDEA を使用すると、ローカルで実行するのと同じ方法で、Docker コンテナー内のコードに対して ESLint(英語) を実行できます。詳細については、「JavaScript リンターおよび ESLint」を参照してください。
Docker の関連するリモート Node.js インタープリターが構成され、プロジェクトのデフォルトとして選択されていることを確認してください。また、このリモートインタープリターに関連付けられたパッケージマネージャーがプロジェクトのデフォルトとして設定されていることを確認してください。詳細については、Docker で Node.js インタープリターを構成するおよび npm、pnpm、yarn と Docker を参照してください。
package.json を開き、ESLint が
devDependencies
セクションにリストされていることを確認します。{ "name": "node-express", "version": "0.0.0", "private": true, "dependencies": { "cookie-parser": "~1.4.4", "debug": "~2.6.9", "express": "~4.16.1", "http-errors": "~1.6.3", "morgan": "~1.9.1", "pug": "^3.0.2" }, "devDependencies": { "eslint": "^8.1.0" } }エディターの任意の場所を右クリックして、コンテキストメニューから実行 '<package manager> install' を選択します。
その後、ESLint はローカルでコードを操作するときと同じように機能します。検出された不一致の説明をエディターまたは問題ツールウィンドウで直接表示し、提案されたクイックフィックスを適用します。詳細については、「JavaScript リンターおよび ESLint」を参照してください。
関連ページ:
プラグインのインストール
プラグインは IntelliJ IDEA のコア機能を拡張します。例: プラグインをインストールして、次の機能を取得します。バージョン管理システム、課題追跡システム、ビルド管理サーバー、その他のツールとの統合。さまざまな言語とフレームワークのコーディング支援サポート。ショートカットのヒント、ライブプレビュー、ファイルウォッチャーなど。新しいプログラミング言語を学ぶのに役立つコーディング演習。プラグイン設定を開くを押して設定を開き、を選択します。マーケットプレースタブを使用して、JetBrains...
Docker
Docker は、分離された再現可能な環境で実行可能ファイルをデプロイおよび実行するためのツールです。これは、たとえば、本番環境と同じ環境でコードをテストする場合に役立ちます。IntelliJ IDEA は Docker 機能を統合し、Docker イメージの作成、Docker コンテナーの実行、Docker Compose アプリケーションの管理、パブリックおよびプライベート Docker レジストリの使用など、IDE から直接実行するための支援を提供します。Docker プラグインを有効にする...
Node.js
このページは、プラグインのインストールに従って、設定 | プラグインページのインストール済みタブで Node.js バンドルプラグインが有効になっている場合にのみ表示されます。Node.js の操作方法については、Node.js アプリケーションの開発セクションを参照してください。次の Node.js バージョンは、IntelliJ IDEA 2023.3 以降でサポートされています。Node.js 20 - アクティブな長期サポート (LTS) バージョン、Node.js 21 - 現在のバージョン...
npm、pnpm、Yarn
IntelliJ IDEA は npm、pnpm、Yarn、Yarn 2、Yarn 3 と統合されているため、組み込みのターミナルで、IDE 内から再利用可能なコードのパッケージをインストール、検索、更新、削除できます。IntelliJ IDEA では、npm、Yarn、pnpm スクリプトを実行およびデバッグすることもできます。IntelliJ IDEA は、package.json ファイルを解析してスクリプトの定義を認識し、スクリプトをツリービューに表示して、ツリー内のスクリプトと packag...
実行 / デバッグ構成: Node.js
作成: 次の Node.js バージョンは、IntelliJ IDEA 2023.3 以降でサポートされています。Node.js 20 - アクティブな長期サポート (LTS) バージョン、Node.js 21 - 現在のバージョン、サポートされている Node.js バージョンの詳細を参照してください。このダイアログで、コンピューター上の Node.js アプリケーションと一緒にデバッガーを開始するための構成を作成します。始める前に:Node.js をダウンロードしてインストールします。JetB...
Node.js の実行とデバッグ
IntelliJ IDEA は、Node.js アプリケーションの実行とデバッグを支援します。IntelliJ IDEA から起動し、すでに実行中のアプリケーションにアタッチするアプリケーションをデバッグできます。始める前に:JavaScript and TypeScript、JavaScript Debugger、Node.js に必要なプラグインが設定 | プラグインページのインストール済みタブで有効になっていることを確認します。詳細については、プラグインのマッピングを参照してください。No...