JavaScript ライブラリを構成する
言語と IDE のコンテキストでは、ライブラリはファイルまたはファイルのセットです。これらのファイルの関数とメソッドは、編集したプロジェクトコードから JetBrains Rider が取得する関数とメソッドに加えて、JetBrains Rider の内部知識に追加されます。プロジェクトのスコープでは、そのライブラリはデフォルトで書き込み保護されています。
JetBrains Rider は、2 つの事前定義された自動生成ライブラリフォルダーを予約します。
node_modules プロジェクト package.json の
dependenciesオブジェクトにリストされている Node.js パッケージを保持します。詳細については、node_modules ライブラリの構成を参照してください。ダウンロードした TypeScript 定義ファイルや CDN リンクから参照したライブラリ、Node.js コア結節や任意のカスタムサードパーティライブラリを格納するための External Libraries。
TypeScript コミュニティスタブをダウンロード (TypeScript 定義ファイル)
JetBrains Rider では、DefinitelyTyped スタブ(英語)をライブラリとして設定および使用できます。これは、次のような場合に特に役立ちます。
コード補完を改善するには、JetBrains Rider 静的解析には高度すぎるライブラリまたはフレームワークのシンボルを解決し、そのようなシンボルの型情報を追加します。
テストフレームワークからグローバルに定義されたシンボルを解決します。
以下の例は、post() 関数が解決されていない Express アプリケーションのコードを示しています。
TypeScript 定義ファイルをインストールすると、JetBrains Rider は post() を正常に解決します。
JetBrains Rider を使用すると、インテンションアクションを使用してエディターから直接 TypeScript 定義ファイルをダウンロードできます。または、設定: JavaScript ライブラリページでそれを行うこともできます。
インテンションアクションを使用して TypeScript 定義をダウンロードする
このライブラリまたはフレームワークの
importまたはrequireステートメントにキャレットを置き、Alt+Enter を押して、より良いタイプ情報を得るための TypeScript 定義のインストールを選択します。
JetBrains Rider はライブラリの型定義をダウンロードし、JavaScript ライブラリページのライブラリリストに追加します:
あるいは、package.json を開き、型定義をダウンロードするパッケージにキャレットを置き、Alt+Enter を押して、「@types/<パッケージ name>」をインストールしますを選択します。
JavaScript ライブラリページで TypeScript 定義をダウンロードする
Ctrl+Alt+S を押して設定を開き、を選択します。
開いたライブラリページでダウンロードをクリックし、開いたライブラリのダウンロードダイアログで必要なライブラリを選択し、ダウンロードしてインストールをクリックします。
JetBrains Rider は、ソリューションエクスプローラーの外部ライブラリノードにダウンロードされた型定義を表示します。
オプション
JetBrains Rider は現在のプロジェクトの範囲でダウンロードされた型定義を可能にします。下記のライブラリのスコープの構成に従ってこの範囲を変更することができます。サンプル: HTML および Node.js コアライブラリのスコープの構成も参照してください。
Node.js コアライブラリを構成する
Node.js バイナリにコンパイルされる fs(英語)、path(英語)、http(英語)、およびその他のコアモジュールのコード補完と参照解決を取得するには、Node.js コアモジュールソースを JavaScript ライブラリとして構成する必要があります。
Ctrl+Alt+S を押して設定を開き、 を選択します。
Node.js コーディング支援チェックボックスを選択します。
Node.js コアライブラリはバージョン固有のものです。Node.js ページで Node.js のバージョンを変更した場合は、もう一度チェックボックスを選択する必要があります。その後、JetBrains Rider はこの新しいバージョン用の新しいライブラリを作成します。
node_modules ライブラリを構成する
プロジェクトの依存関係にコード補完を提供するために、JetBrains Rider は node_modules ライブラリを自動的に作成するため、Node.js モジュールはプロジェクトに保持されますが、それらに対してインスペクションは実行されないため、パフォーマンスが向上します。
ソリューションエクスプローラーでは、node_modules もライブラリとしてマークされています。
ただし、node_modules ライブラリには、プロジェクトの package.json ファイルの dependencies オブジェクトにリストされているモジュールのみが含まれています。JetBrains Rider は依存関係の依存関係を node_modules ライブラリに含めませんが、実際にはそれらをプロジェクトから除外します。
ライブラリのスコープを構成する
JetBrains Rider は、クライアント側のコードで Node.js API など、無関係な補完を提案することがあります。これは、デフォルトで JetBrains Rider がプロジェクトフォルダー全体の補完のためにライブラリを使用するためです。JetBrains Rider では、ライブラリのスコープを設定することでコード補完を調整できます。
Ctrl+Alt+S を押して設定を開き、を選択します。
ライブラリページには、利用可能なライブラリのリストが表示されます。
必要なライブラリの横にある有効チェックボックスをオフにして、スコープの管理をクリックします。「JavaScript ライブラリ: 使用範囲」ダイアログが開きます。
JavaScript ライブラリの使用スコープダイアログで、追加ボタン (
) をクリックし、ライブラリスコープに含めるファイルまたはフォルダーを選択します。JavaScript ライブラリの使用スコープダイアログでは、パスフィールドに選択したファイルまたはフォルダーが表示されます。追加されたファイルまたはフォルダーごとに、ライブラリリストから、構成するライブラリを選択します。
サンプル: HTML および Node.js コアライブラリのスコープを構成する
JetBrains Rider でフルスタックの JavaScript アプリケーションに取り組んでいると、コード補完がクライアント側のコードに Node.js API をいくつか提案し、Node.js コードに DOM API を提案していることに気付くことがよくあります。これは、DOM API を使用する HTML ライブラリと Node.js API を使用する Node.js コアライブラリがプロジェクト全体でデフォルトで有効になっているために発生します。無関係な補完候補を取り除くには、これらのライブラリのスコープを構成する必要があります。
Ctrl+Alt+S を押して設定を開き、を選択します。
ライブラリページには、利用可能なライブラリのリストが表示されます。
HTML および Node.js コアの項目の横にある有効チェックボックスをオフにします。
スコープの管理をクリックします。JavaScript ライブラリの使用スコープダイアログが開きます。
HTML ライブラリのスコープを構成するには、「
」をクリックします。
開いたダイアログで、クライアント側のコードが含まれるフォルダーを選択し、開くをクリックします。
JavaScript ライブラリの使用スコープダイアログに戻り、選択したフォルダーがリストに追加されます。
各フォルダーの横にあるライブラリリストから、HTML を選択します。
Node.js コアライブラリのスコープを構成するには、
を再度クリックし、サーバー側コードを含むフォルダーを追加し、それぞれに対してライブラリリストから Node.js コアを選択します。
現在、JetBrains Rider は HTML および Node.js コアライブラリからアイテムを解決し、これらの選択されたプロジェクトフォルダーからのファイルでのみ補完して提案します。
同様に、自動的に作成される node_modules ライブラリのスコープを構成できます。node_modules ライブラリの構成を参照してください。
CDN リンク経由で追加されたライブラリを構成する
ライブラリ .js ファイルが CDN リンクを介して参照される場合、ランタイムでは使用できますが、JetBrains Rider では表示されません。そのようなライブラリ .js ファイルから補完リストにオブジェクトを追加するには、ファイルをダウンロードして外部ライブラリとして構成します。
ライブラリをダウンロードする
ライブラリへの CDN リンクにキャレットを置き、Alt+Enter を押して、リストからライブラリのダウンロードを選択します。
ライブラリは JetBrains Rider キャッシュにダウンロードされます (プロジェクトにはダウンロードされません)。情報メッセージを含むポップアップが表示されます。
JavaScript ライブラリページで、ダウンロードしたライブラリがリストに追加されます。
ソリューションエクスプローラーでは、ライブラリは外部ライブラリノードに表示されます。
ライブラリの可視性を変更する
デフォルトでは、JetBrains Rider はダウンロードしたライブラリをグローバルとマークします。つまり、他の JetBrains Rider プロジェクトでも有効にして再利用できます。このデフォルト設定を変更するには、ダウンロードしたライブラリをリストから選択し、編集をクリックし、表示されるライブラリの編集ダイアログでプロジェクトを選択します。
カスタムのサードパーティ JavaScript ライブラリを構成する
プロジェクトまたはマシン上の他の場所に JavaScript フレームワークファイルがあり、それを編集するプロジェクトコードとしてだけでなく、ライブラリとして JetBrains Rider に処理させたいとします。
必要なフレームワークファイルをダウンロードします。
Ctrl+Alt+S を押して設定を開き、を選択します。
ライブラリページで、追加をクリックします。
新規ライブラリダイアログで、外部 JavaScript ライブラリの名前を指定します。
追加ボタン (
) をクリックし、リストからファイルを添付またはディレクトリを添付を選択します。
ファイルブラウザーで、フレームワークをダウンロードしたファイルまたはフォルダーを選択します。
OK をクリックすると、ライブラリページに戻り、新しいライブラリがリストに追加されます。
ソリューションエクスプローラーでは、ライブラリは外部ライブラリノードに表示されます。
オプション
デフォルトでは、ライブラリは現在のプロジェクト全体の有効範囲で有効になっています。ライブラリのスコープの構成の説明に従って、このデフォルト設定を変更することができます。
ドキュメント URL 領域で、ライブラリまたはフレームワークの公式ドキュメントへのパスを指定します。このライブラリのシンボルで Shift+F1 を押すと、JetBrains Rider はこの URL を開きます。
ファイルに関連付けられたライブラリを表示する
エディターでファイルを開き、Ctrl+Shift+A を押して、リストから JavaScript ライブラリの使用を選択します。
JetBrains Rider には、使用可能な構成済みライブラリのリストが表示されます。現在のファイルに関連付けられているライブラリにはチェックマークが付いています。
現在のファイルをライブラリのスコープから削除するには、このライブラリの横にあるチェックマークを外します。
ライブラリを現在のファイルに関連付けるには、このライブラリの横にチェックを入れます。
ライブラリを削除する
Ctrl+Alt+S を押して設定を開き、を選択します。
ライブラリページには、使用可能なライブラリのリストが表示されます。
ライブラリを選択して除去をクリックします。
関連ページ：
Node.js
このページは、プラグインのインストールに従って、設定 | プラグインページのインストール済みタブで Node.js バンドルプラグインが有効になっている場合にのみ表示されます。次の Node.js バージョンは、JetBrains Rider 2023.3 以降でサポートされています。Node.js 20 - アクティブな長期サポート (LTS) バージョン、Node.js 21 - 現在のバージョン、サポートされている Node.js バージョンの詳細情報 Node インタープリターこのフィールドで...
Jsdoc コメント
JetBrains Rider は Jsdoc コメントを認識し、開始ブロックコメントを入力してを押すと、、やその他のタグを自動的に挿入することで作成できます。JSDoc コメントは、JavaScript および TypeScript でのを使用したドキュメント検索に使用されます。JavaScript ドキュメントの検索および TypeScript ドキュメントのルックアップを参照してください。また、連鎖メソッドでの型アノテーションおよびメソッド戻り型ヒントにも使用されます。JetBrains...