IntelliJ IDEA 2020.3 ヘルプ

Node.js

Node.js(英語) は、ブラウザーの外部、たとえばサーバーやコマンドラインで JavaScript を実行するための軽量なランタイム環境です。IntelliJ IDEA は Node.js と統合し、アプリケーションの構成、編集、実行、デバッグ、テスト、プロファイリング、メンテナンスを支援します。

Node.js がアプリケーションのローカルランタイムとして、または npm パッケージの管理、JavaScript リンターの実行、ツールのビルド、フレームワークのテストなどにのみ必要な場合は、Node.js(英語) をインストールするだけです。標準のインストール手順に従うと、ほとんどの場合、IntelliJ IDEA は Node.js 自体を検出します。

また、コンピューターに Node.js がない場合でも、新規プロジェクトの作成ダイアログで新しい Node.js アプリケーションを作成するときにインストールできます(以下の新しい Node.js アプリケーションを作成するを参照)。

複数の Node.js インストールを切り替える場合は、ローカル Node.js インタープリターとして構成する必要があります。ほとんどの場合、IntelliJ IDEA は Node.js インストールを検出し、インタープリターとして自動的に構成し、関連するものを選択できるリストに追加します。

Node.js アプリケーションをリモートで実行するには、リモートインタープリターとして構成します。詳細については、Node.js と Docker を参照してください。

Node.js バージョン間の切り替え

IntelliJ IDEA を使用すると、Node.js を複数インストールし、同じプロジェクトで作業しながら切り替えることができます。

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語およびフレームワーク | Node.js および NPM に移動します。

  2. 開いた Node.js および NPM ページで、Node インタープリターリストから必要な Node.js インストールを選択します。

    標準のインストール手順に従っている場合、ほとんどの場合、必要な Node.js インストールがリストに含まれています。インストールが欠落している場合は、the Browse button をクリックし、ローカルインタープリターとして手動で構成します

システム Node.js バージョンの使用

IntelliJ IDEA を使用すると、デフォルトのシステムノードエイリアスをプロジェクトの Node.js バージョンとして設定できます。その後、このバージョンは、Node.js を必要とするすべてのツールおよびすべての新しい実行 / デバッグ構成で自動的に使用されます。特に、新しい Node.js バージョンをインストールしてシステムのデフォルトのノードエイリアスにする場合、各ツールの設定を更新する必要がないことを意味します。

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語およびフレームワーク | Node.js および NPM に移動します。

  2. Node インタープリターリストから node を選択します。

    Default system node

  3. 必要に応じて、この新しい Node.js インタープリターを指定します(たとえば、実行 / デバッグ構成や特定のツールの設定など)。

ローカル Node.js インタープリターの構成

Node.js をデフォルト以外の場所にインストールして、IntelliJ IDEA が自動的に検出しないようにする場合など、Node.js インストールをインタープリターとして手動で構成する必要がある場合があります。

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語およびフレームワーク | Node.js および NPM に移動します。

  2. 開いた Node.js および NPM ページで、Node インタープリターリストの横にある the Browse button をクリックします。

  3. 現在構成されているすべてのインタープリターのリストが表示された Node.js インタープリターダイアログで、ツールバーの the Add button をクリックします。開いたダイアログで、コンテキストメニューからローカル追加を選択し、Node.js のインストールを選択してから OK をクリックします。Node.js インタープリターダイアログに戻り、Node インタープリター読み取り専用フィールドに新しいインタープリターへのパスが表示されます。

  4. パッケージマネージャーフィールドで、現在のプロジェクトのパッケージマネージャー(npm、Yarn、または pnpm)を選択します。

    詳細はプロジェクトのパッケージマネージャーの設定を参照してください。

OK をクリックすると Node.js および NPM ページに戻り、Node インタープリターフィールドに新しいインタープリターが表示されます。

Windows Subsystem for Linux で Node.js を使用する

IntelliJ IDEA では、Windows Subsystem for Linux の Node.js(英語) を使用して Node.js アプリケーションを実行およびデバッグできます。WSL の Node.js を現在のプロジェクトのデフォルトインタープリターとして選択するか、Node.js 実行 / デバッグ構成でこのノードバージョンを構成して使用できます。

WSL の Node.js をデフォルトのプロジェクトノードインタープリターとして構成する

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語およびフレームワーク | Node.js および NPM に移動します。

  2. Node.js インタープリターダイアログで Node インタープリターフィールドの横にある the Browse button をクリックし、the Add button をクリックして、リストから WSL を追加するを選択します。

  3. 開いている WSL ノードインタープリターを追加するダイアログで、使用している Linux ディストリビューションを選択し、Node.js へのパスを指定します。

Node.js アプリケーションの作成

まだアプリケーションがない場合は、テンプレートから Node.js 固有の構造を使用して IntelliJ IDEA プロジェクトを生成するか、空の IntelliJ IDEA プロジェクトを作成し、その中に Node.js を以下の既存の Node.js アプリケーションから始めるの説明に従って構成できます。

新しい Node.js アプリケーションを作成する

  1. メインメニューからファイル | 新規 | プロジェクトを選択するか、ウェルカム画面の新規プロジェクトボタンをクリックします。

  2. 新規プロジェクトダイアログで、左側のペインで JavaScript を選択します。

  3. 右側のペインで、Express を選択し、次へをクリックします。

  4. ウィザードの 2 ページ目で、プロジェクトフォルダー、Node.js インタープリター、およびパッケージマネージャー( npm(英語) または Yarn(英語)、詳細については npm、pnpm、Yarn を参照)を指定します。

    Express アプリケーションの場合、express-generator フィールドに express -generator(英語) を指定します。

    ジェネレーターをダウンロードして実行する npx(英語) を使用することをお勧めします。これを行うには、express -generator リストから npx --package express-generator express を選択します。

    または、埋め込まれたターミナルAlt+F12)を開いて npm install --g express-generator と入力し、ダウンロードしたジェネレーターを express-generator リストから選択します。

    Select express generator

    使用するテンプレート言語とスタイルシート言語を選択します。

  5. Finish をクリックすると、IntelliJ IDEA が必要な依存関係をダウンロードし、それらの依存関係および Node.js コア API に対してコード補完を有効にします。詳細については、node_modules ライブラリの構成Node.js コアライブラリの構成を参照してください。

    Express の場合、IntelliJ IDEA はデフォルト設定でタイプ Node.js の実行 / デバッグ構成を作成し、Express 固有の基本的なディレクトリ構造(英語)を生成します。

    Node.js の場合、IntelliJ IDEA は npm init コマンドを実行して package.json ファイルを生成するだけです。

空の IntelliJ IDEA プロジェクトを作成する

  1. メインメニューからファイル | 新規 | プロジェクトを選択するか、ウェルカム画面の新規プロジェクトボタンをクリックします。

  2. 新規プロジェクトダイアログで、左側のペインで JavaScript を選択します。

  3. 右側のペインで、もう一度 JavaScript を選択して次へをクリックします。

  4. ウィザードの 2 ページ目で、プロジェクトフォルダーと名前を指定し、完了をクリックします。

既存の Node.js アプリケーションから始める

既存の Node.js アプリケーションを引き続き開発する場合は、IntelliJ IDEA でそれを開き、その中に Node.js を構成し、必要な依存関係をダウンロードします。

すでにマシン上にあるアプリケーションソースを開く

  • ウェルカム画面で開くまたはインポートをクリックするか、メインメニューからファイル | 開くを選択します。開いたダイアログで、ソースが保存されているフォルダーを選択します。

バージョン管理からアプリケーションのソースを確認してください

  1. ウェルカム画面で VCS から取得をクリックするか、メインメニューから VCS | バージョン管理から取得を選択します。

  2. 呼び出されたダイアログで、リストからバージョン管理システムを選択し、アプリケーションソースをチェックアウトするリポジトリを指定します。

プロジェクトで Node.js を構成する

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語およびフレームワーク | Node.js および NPM に移動します。

  2. Node インタープリターフィールドで、現在のプロジェクトのデフォルトの Node.js インタープリターを指定します。IntelliJ IDEA は、実行 / デバッグ構成を作成するとき、または Prettier や ESLint などの Node.js に依存するツールを構成するときに、Node インタープリターリストから Project エイリアスを選択するたびに自動的に使用します。

    リストから構成済みのインタープリターを選択するか、the Browse button をクリックして、ローカル Node.js インタープリターの構成に従って開いたダイアログで新しいインタープリターを構成します。node を選択すると、システム Node.js のバージョンが使用されます。

  3. Node.js のコーディング支援チェックボックスを選択して、Node.js コアモジュールのソースを JavaScript ライブラリとして設定し、プロジェクトに関連付けます。その結果、IntelliJ IDEA は、fspathhttp、Node.js バイナリにコンパイルされる Node.js の他の部分に対して、コード補完、参照解決、検証、デバッグ機能を提供します。

    構成が完了すると、IntelliJ IDEA は現在構成されているバージョンに関する情報を表示します。

  4. プロジェクトの一部でのみ Node.js API にコード補完が必要な場合は、スコープの管理リンクを使用してそれを構成できます。開いた使用箇所ダイアログで、関連するディレクトリをクリックし、リストごとに構成済みの Node.js コアライブラリを選択します。ライブラリのスコープの構成から詳細を参照してください。

プロジェクトの依存関係をダウンロードし、次のいずれかを実行する

  • 埋め込みターミナルAlt+F12)に次のように入力します。

    npm install

  • プロジェクトルートの package.json ファイルのコンテキストメニューから実行 'npm install' を選択します。

関連ページ:

Node.js と Docker

Node.js アプリケーションを Docker で素早くブートストラップして、IntelliJ IDEA から実行、デバッグ、プロファイルを作成できます。IDE は、新しい Dockerfile を自動的に作成し、イメージをビルドおよび実行し、ソースコードを同期し、npm 依存関係をコンテナーにインストールすることにより、初期構成を処理します。WebStorm と Docker のクイックツアーでいくつかの例を見つけることができます。始める前に JetBrains リポジトリからプラグインをインストー...

Node.js インタープリターダイアログ

次の Node.js バージョンが IntelliJ IDEA 2020.3 でサポートされています。Node.js 10、Node.js 12、Node.js 14、Node.js 15、サポートされている Node.js バージョンの詳細を参照してください。このダイアログを使用して、ローカルまたはリモート Node.js インタープリターまたは Windows Subsystem for Linux の Node.js を構成します。ローカル Node.js インタープリターという用語は、コンピュ...

npm、pnpm、Yarn

IntelliJ IDEA は npm、Yarn、Yarn 2、pnpm と統合されているため、IDE 内から再利用可能なコードのパッケージをインストール、検索、更新、削除できます。Node.js と NPM ページは、パッケージを管理するための専用 UI を提供します。もちろん、組み込みのターミナルのコマンドラインからも実行できます。IntelliJ IDEA では、npm、Yarn、pnpm スクリプトを実行およびデバッグすることもできます。IntelliJ IDEA は、package.jso...

Node.js の実行とデバッグ

IntelliJ IDEA は、Node.js アプリケーションの実行とデバッグを支援します。IntelliJ IDEA から起動し、すでに実行中のアプリケーションにアタッチするアプリケーションをデバッグできます。始める前に:設定 / 環境設定 | プラグインページで Node.js バンドルプラグインが有効になっていることを確認してください。詳細については、プラグインの管理を参照してください。Node.js アプリケーションを実行する:IntelliJ IDEA は、タイプ Node.js の実行...

JavaScript ライブラリを構成する

IntelliJ IDEA では、ライブラリは、IntelliJ IDEA が編集するプロジェクトコードから取得する関数とメソッドに加えて、IntelliJ IDEA の内部知識に関数とメソッドが追加されたファイルまたはファイルのセットです。プロジェクトの範囲では、そのライブラリはデフォルトで書き込み保護されています。IntelliJ IDEA は、コーディング支援(つまり、コード補完、構文ハイライト、ナビゲーション、ドキュメントの参照)を強化するためにのみライブラリを使用します。ライブラリはプ...

Markdown

Markdown は、プレーンテキストにフォーマット要素を追加するための軽量マークアップ言語です。IntelliJ IDEA は Markdown ファイルを認識し、ハイライト、補完、フォーマットを備えた専用エディターを提供し、ライブプレビューペインにレンダリングされた HTML を表示します。新しい Markdown ファイルを作成するデフォルトでは、IntelliJ IDEA は、.md または .markdown 拡張子を持つすべてのファイルを Markdown ファイルとして認識します。プロジェ...