IntelliJ IDEA 2021.1 ヘルプ

Vue.js

Vue.js(英語) は、ユーザーインターフェースと高度な単一ページアプリケーションを開発するためのフレームワークです。IntelliJ IDEA は、個別のファイル、属性、プロパティ、メソッド、スロット名などで定義されたコンポーネントを含むコンポーネントの Vue.js 対応コード補完を使用して、HTML、CSS、JavaScript の Vue.js ビルドブロックのサポートを提供します。

ビルトインデバッガーを使用すると、Vue.js のコードを IntelliJ IDEA で直接デバッグすることができます。IntelliJ IDEA は、開発サーバーを起動して開発モードでアプリケーションを起動する npm 構成や、デバッグセッションを起動する JavaScript デバッグ設定など、必要に応じて必要な実行 / デバッグ構成を自動的に生成します。

始める前に

  1. Node.js(英語) をダウンロードしてインストールします。

  2. JetBrains リポジトリからプラグインをインストールする説明に従って、設定 / 環境設定 | プラグインページで Vue.js プラグインをインストールして有効にします。

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

新しい Vue.js アプリを作成するための推奨される方法は Vue CLI(英語) です。これは、IntelliJ IDEA が npx(英語) を使用してダウンロードして実行します。

もちろん、Vue CLI を自分でダウンロードすることも、空の IntelliJ IDEA プロジェクトを作成して、Vue.js や、babel(英語)webpack(英語)ESLint(英語) などの他のツールを使用してブートストラップすることもできます。

アプリケーションを作成する

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

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

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

  4. ウィザードの 2 ページ目で、プロジェクト名とそれを作成するフォルダーを指定します。Node インタープリターフィールドに、使用する Node.js インタープリターを指定します。リストから設定済みのインタープリターを選択するか、または追加を選択して新しいインタープリターを設定します。

    Vue CLI リストから、npx --package @vue/cli vue を選択します。

    または、npm バージョン 5.1 以前の場合、ターミナル Alt+F12npm install --g @vue/cli を実行して、@vue/cli パッケージを自分でインストールします。アプリケーションを作成するときに、@vue/cli パッケージが保存されているフォルダーを選択します。

    babel(英語)ESLint(英語) を使用してアプリケーションをブートストラップするには、デフォルトのプロジェクトセットアップを使用するチェックボックスを選択します。

  5. Finish をクリックすると、IntelliJ IDEA は必要なすべての設定ファイルを含む Vue.js 固有のプロジェクトを生成し、必要な依存関係をダウンロードします。実行ツールウィンドウで進行状況を確認できます。

空のプロジェクトに Vue.js をインストールする

  1. Vue.js を使用する空のプロジェクトを開きます。

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

    npm install vue

既存の Vue.js アプリケーションから開始する

既存の Vue.js アプリケーションの開発を継続するには、IntelliJ IDEA で開き、必要な依存関係をダウンロードします。

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

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

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

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

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

依存関係をダウンロードする

コードの作成と編集

.vue ファイルでは、IntelliJ IDEA は scriptstyletemplate ブロックを認識します。 script タグ内で JavaScript と TypeScript を使用でき、style タグ内でスタイルシート言語を使用でき、template タグ内で HTML と Pug を使用できます。

script タグ内で TypeScript を使用すると、IntelliJ IDEA はタイプチェックのために TypeScript 言語サービス(英語)を呼び出し、検出されたエラーを TypeScript ツールウィンドウのエラーおよびコンパイルエラータブに表示します。または、TSLint を使用した Vue.js コンポーネントの Lint TypeScript に従って TsLint を使用できます。

Vue.js コンポーネント

IntelliJ IDEA は .vue ファイルタイプを認識し、Vue.js コンポーネント用の専用 .vue ファイルテンプレートを提供します。

Vue.js コンポーネントを作成する

  • プロジェクトツールウィンドウで、新しいコンポーネントの親フォルダーを選択し、リストから Vue コンポーネントを選択します。

    ws_vue_file_template.png

また、既存のコンポーネントから新しい Vue.js コンポーネントをコピーして貼り付けることなく、専用のインテンションアクションまたはリファクタリングを使用して抽出することもできます。新しく抽出されたテンプレートで使用されるすべてのデータとメソッドは、親コンポーネントに残ります。IntelliJ IDEA は、プロパティとともに新しいコンポーネントに渡し、関連するスタイルをコピーします。

コンポーネントの抽出

  1. 抽出してコンポーネント抽出を呼び出すテンプレートフラグメントを選択します。

    • インテンションアクションを使用するには、Alt+Enter を押してから、リストから Vue コンポーネントの抽出を選択します。

    • リファクタリングを使用するには、メインメニューまたは選択範囲のコンテキストメニューからリファクタリング | 抽出 | Vue コンポーネントの抽出を選択します。

  2. 新しいコンポーネントの名前を入力します。この名前がすでに使用されているか無効である場合、IntelliJ IDEA は警告を表示します。それ以外の場合は、新しい単一ファイルコンポーネントが作成され、親コンポーネントにインポートされます。

    ws_extract_vue_component.png

コード補完

スクリプト、スタイル、テンプレートブロック内の完全なコード

  • デフォルトでは、IntelliJ IDEA は script ブロック内の ECMAScript 6 および style ブロック内の CSS にコード補完を提供します。

    Vue.js: completion for ES6 inside <script> tag
  • template タグ、コード補完 Ctrl+Space 内、および Vue.js コンポーネントと属性の定義 Ctrl+B へのナビゲーションが利用可能です。

    Vue.js: completion inside template tags

完全な Vue.js プロパティとメソッド

  • IntelliJ IDEA は、Vue.js のプロパティ、data オブジェクトのプロパティ、計算されたプロパティ、メソッドの補完も提案します。

    Vue.js: completion for interpolations

完全なスロット名

  • IntelliJ IDEA は、ライブラリコンポーネントおよびプロジェクトで定義されたコンポーネントからのスロット(英語)名の補完を提供します。

    プロジェクトに名前付きスロットを持つコンポーネントが含まれている場合、IntelliJ IDEA は template タグの v-slot ディレクティブにこれらの名前の提案を表示します。

  • Vuetify(英語)Quasar(英語)、または BootstrapVue(英語) を使用している場合、スロット名にコード補完も使用できます。

別のファイルで定義された完全なコンポーネント

  • コンポーネントが複数のファイルで定義されている場合(英語)、IntelliJ IDEA はコンポーネントのパーツ間のリンクを認識し、プロパティ、データ、メソッドに適切なコード補完を提供します。

    例: コンポーネントのパーツが、vue ファイルで src 属性を介してリンクされている個別の JavaScript およびスタイルシートファイルで定義されている場合、JavaScript で定義されたプロパティは、メソッドと同様にテンプレートで適切に補完されます。

  • コンポーネントの template プロパティのテンプレートリテラル内のテンプレートは、このコードが template タグ内にあるかのように補完されます。

    テンプレートが別の HTML ファイルで定義され、template プロパティにリンクされている場合、完了も使用できます。

Vue.js インジェクション内の完全なコード

HTML ファイル内の Vue.js インジェクション内で、IntelliJ IDEA は Vue.js 構文を認識し、それに応じてコードをハイライトします。これらのライブラリをプロジェクトの依存関係に追加せずに、HTML ファイルの CDN からリンクされている Vue.js ライブラリからシンボルの補完を取得することもできます。

Download libraries linked via CDN
  1. 外部 Vue.js ライブラリへの CDN リンクを含む HTML ファイルを開きます。IntelliJ IDEA はリンクをハイライトします。

  2. ライブラリの補完を有効にするには、リンク上で Alt+Enter を押し、リストからライブラリをダウンロードを選択します。または、リンクの上にマウスを置いてライブラリをダウンロードをクリックします。

ライブラリが設定 / 環境設定 | 言語およびフレームワーク | JavaScript | ライブラリページの JavaScript ライブラリのリストに追加されます。詳細については、CDN リンクを介して追加されたライブラリの構成を参照してください。

パラメーターヒント

パラメーターヒントは、コードを読みやすくするためのメソッドや関数のパラメーター名を示します。デフォルトでは、リテラルまたは関数式であるが名前付きオブジェクトではない値に対してのみ、パラメーターヒントが表示されます。

パラメーターのヒントを設定する

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S を開き、エディター | インレイヒント | Vue に進みます。

  2. リストからパラメーターヒントを選択し、パラメーターヒントを表示チェックボックスが選択されていることを確認してから、パラメーターヒントを表示するコンテキストを指定します。

  3. 一部のメソッドおよび関数では、IntelliJ IDEA はどのコンテキストでもパラメーターヒントを表示しません。除外リスト... をクリックして、これらのメソッドと機能を表示したり、それらのパラメーターヒントを有効にしたり、リストに新しいアイテムを追加したりします。

Vue.js ライブテンプレート

IntelliJ IDEA を使用すると、Sarah Drasner によって作成されたコレクション(英語)から適応された Vue.js のライブテンプレートのコレクションを使用できます。

  1. 使用するテンプレートの省略形を入力するか、Ctrl+J を押して、使用可能なテンプレートのリストから選択します。

  2. テンプレートを展開するには、Tab を押します。

  3. テンプレート内のある変数から別の変数に移動するには、Tab をもう一度押します。

    ws_vue_snippet.png

Vue.js アプリケーションの Nuxt.js

IntelliJ IDEA を使用すると、Vue.js アプリケーションで Nuxt.js(英語) フレームワークを使用できます。IntelliJ IDEA で Nuxt.js(英語) アプリをセットアップするための推奨される方法は、create-nuxt-app コマンドを使用します。または、Nuxt.js を既存のプロジェクトにインストールするを使用することもできます。

create-nuxt-app を使用してプロジェクトを作成する

  1. 空の IntelliJ IDEA プロジェクトを作成します。

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

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

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

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

  2. 埋め込みターミナルAlt+F12)を開いて、次のように入力します。

    npx create-nuxt-app <project name>

    または

    yarn create nuxt-app <project name>

  3. ウィザードはあなたにいくつかの質問をします。それらに答えると、Nuxt プロジェクトが現在のフォルダーで初期化され、IntelliJ IDEA で使用できるようになります。

Nuxt.js 公式 Web サイト(英語)の詳細を参照してください。

Nuxt.js を既存のプロジェクトにインストールする

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

    npm install --save nuxt

@types/nuxt パッケージをインストールする

@types/nuxt パッケージを使用すると、より優れたコード補完を取得できます。

  • 2.9.0 以降の Nuxt.js バージョンを使用していて、@nuxt/types パッケージがインストールされていない場合、IntelliJ IDEA はそれについて通知し、開発依存関係としてインストールすることを提案します。通知ポップアップの @nuxt/types を dev 依存関係としてインストールするリンクをクリックします。

    Notification about missing @nuxt/types

    ポップアップを閉じても、イベントログツールウィンドウ(表示 | ツールウィンドウ | イベントログ)の @nuxt/types を dev 依存関係としてインストールするリンクをクリックして @nuxt/types をインストールできます。

  • または、埋め込まれたターミナルAlt+F12)を開き、次のように入力します。

    npm install --save-dev @nuxt/types

Nuxt.js 対応のコーディング支援

IntelliJ IDEA はコード補完を提案し、すべてのコア Nuxt.js コンポーネント(英語)クイックドキュメントを示します。

Completion and quick doc for Nuxt component

IntelliJ IDEA は Vuex ストア(英語)への参照を解決し、それらのハイライトと補完を提供します。

Code completion for Vuex store

IntelliJ IDEA は、static フォルダーに <img src='/logo.png/> 形式で保管されているアセット(英語)へのすべての参照を解決します。

nuxt.config.js を編集する

IntelliJ IDEA は、nuxt.config.js(英語) 構成ファイルの適切な補完提案を提供します。

Code completion in nuxt.config.js

カーソルを合わせると、ファイルで使用されている Nuxt オプションの型情報を示すドキュメントポップアップも表示されます。

Quick documentation popup in nuxt.config.js

モジュールの解決

IntelliJ IDEA は、Nuxt.js 固有の webpack セットアップをサポートします。Nuxt.js 2.12.0 以降、IntelliJ IDEA は webpack.config.js 構成ファイルを自動的に検出し、そこからモジュール解決ルールを使用してコーディングを支援します。

Notification about using webpack.config.js for module resolution and code completion

Vue.js アプリケーションでのフォーマット

インデントを構成する

デフォルトでは、トップレベルのタグ内のコードは、Vue.js 固有のスタイルで均一にインデントされます。このインデントは、使用する言語に依存するように構成できます。たとえば、HTML や Pug 固有です。

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、エディター | コードスタイル | Vue に移動し、タブとインデントタブを開きます。

  2. デフォルトでは、すべてのトップレベルタグのコンテンツは、Vue.js 固有のスタイルで均一にインデントされます。デフォルトのインデント設定を受け入れるか、ページのコントロールを使用してカスタマイズします。設定を変更すると、右側のペインのプレビューに、変更がコードのフォーマットにどのように影響するかが表示されます。

    トップレベルタグ内のコードをその言語に関してインデントするには、ブロック内の言語に固有を選択します。

  3. トップレベルのタグの子をインデントするフィールドで、コードに最初のインデントを付ける必要がある最上位のタグを指定します。

    デフォルトでは、template タグ内のコードのみに最初のインデントがあります。必要に応じて、コンマを区切り文字として使用して他のタグを追加します。例: フィールドで script を指定すると、すべての script タグ内のコードは、プレビューペインに示されているように最初のインデントを取得します。

スペースを構成する

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、エディター | コードスタイル | Vue に移動し、スペースタブを開きます。

  2. デフォルトでは、IntelliJ IDEA は、Mustache 構文による Vue.js テキスト補間(英語)の左波括弧({)の後、終了 } の前にスペースを自動的に挿入します。

    スペースの自動挿入を抑制するには、補間チェックボックスをオフにします。

折り返しとブレースを構成する

  1. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、エディター | コードスタイル | Vue に移動し、折り返しと括弧タブを開きます。

  2. Vue.js 補間内の JavaScript 式(英語)に改行がある場合、IntelliJ IDEA はこの JavaScript 式を新しい行から自動的に開始し、その後に新しい行を追加します。

    このデフォルトの動作を変更するには、「{{」の後の改行および '}}' の前の改行チェックボックスをオフにします。

  3. Vue.js コードスタイル: ビジュアルガイドの説明に従って、複数の右マージンを構成します。

  4. 折り返しオプションに従って、補間の折り返しを構成します。

Prettier による Vue.js コードの再フォーマット

特定のファイルが変更されるたびに再フォーマットするように Prettier を構成し、変更が自動または手動で保存されます。

また、Prettier を特定のファイルのデフォルトのフォーマッターとして設定できます。 Ctrl+Alt+L でコードを再フォーマットするたびに、このようなファイルに対して実行されます。

詳細は Prettier でコードを再フォーマットするを参照してください。

Prettier でコードを再フォーマットする

  • エディターで、再フォーマットするコードフラグメントを選択します。ファイルまたはフォルダーを再フォーマットするには、プロジェクトツールウィンドウで選択します。次に、コンテキストメニューから Prettier で再フォーマットを選択します。

  • 特定のファイルに対して Prettier を自動的に実行するには、設定 / 環境設定ダイアログ Ctrl+Alt+S を開き、言語およびフレームワーク | JavaScript | Prettier に移動し、コードの再フォーマットについておよび保存時チェックボックスを使用して、Prettier をトリガーするアクションを指定します。

    詳細は、保存時に Prettier を自動的に実行するおよび Prettier をデフォルトのフォーマッターとして設定するを参照してください。

IntelliJ IDEA は、Prettier の構成から IntelliJ IDEA コードスタイル設定にキーコードスタイルルールを適用して、生成されたコード(リファクタリングやクイックフィックス後など)と Prettier ですでに処理されたコードが一貫してフォーマットされるようにできます。

Prettier コードスタイルルールを適用する

  • Prettier が有効になっているプロジェクトで、package.json を開き、タブ上部のペインではいをクリックします。

    Pane above package.json: apply Prettier code style
  • Prettier コードスタイルを再適用するには(ペインでいいえをクリックするかコードスタイルを変更した後)、Ctrl+Shift+A を押してアクションの検索リストから Prettier コードスタイルルールを適用を選択します。

TSLint を使用した Vue.js コンポーネントの Lint TypeScript

typescript-tslint-plugin(英語) を使用して、Vue.js 単一ファイルコンポーネントの TypeScript コードをリントできます。

typescript-tslint-plugin は、現在のプロジェクトにインストールされている TypeScript でのみ動作するため、設定 / 環境設定ダイアログ Ctrl+Alt+STypeScript ページの TypeScript フィールドで、プロジェクト node_modules フォルダーの typescript パッケージが選択されていることを確認してください。

typescript-tslint-plugin をインストールして構成する

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

    npm install --save-dev typescript-tslint-plugin

  2. tsconfig.json ファイルの plugins プロパティで、次のように入力します。

    { "compilerOptions": { "plugins": [{"name": "typescript-tslint-plugin"}] } }

  3. typescript-tslint-plugin を使用している場合、TSLint は TypeScript 言語サービス(英語)を介して実行されているため、IntelliJ IDEA との TSLint 統合を無効にして、エラー報告の重複を回避できます。

    これを行うには、設定 / 環境設定ダイアログ Ctrl+Alt+S を開き、言語およびフレームワーク | TyprScript | TSLint に移動して TSLint を使用不可にするを選択します。

Vue.js アプリケーションの実行とデバッグ

上記のように Vue CLI で作成されたアプリケーションの場合、IntelliJ IDEA はデフォルト設定で 2 つの実行 / デバッグ構成を生成します。

  • デフォルト名が npm servenpm 構成。この構成では、開発サーバーを起動してアプリケーションを開発モードで起動する npm serve コマンドを実行します。

  • デフォルト名アプリケーションのデバッグJavaScript デバッグ構成。この設定はデバッグセッションを開始します。

Vue.js アプリケーションを実行する

  1. ツールバーのリストから npm serve run 構成を選択し、リストの横にある Run をクリックします。

    または、ターミナル Alt+F12npm start を実行するか、npm ツールウィンドウ表示 | ツールウィンドウ | npm)で start タスクをダブルクリックします。

  2. アプリケーションがコンパイルされ、開発サーバーの準備ができるまで待ちます。

    実行ツールウィンドウまたはターミナルには、アプリケーションが実行されている URL が表示されます。デフォルトでは http://localhost:8080/ です。このリンクをクリックして、アプリケーションを表示します。

    Vue.js app is running

開発サーバーが稼働しているときは、ソースファイルを変更して更新を保存するとすぐに、アプリケーションが自動的に再ロードされます。

Vue.js アプリケーションをデバッグする

アプリケーションの作成方法と実行場所に応じて、さまざまな方法でデバッグセッションを開始できます。

Vue CLI で作成されたアプリケーションをデバッグする

  1. コードにブレークポイントを設定します。

  2. 上記のように開発モードでアプリケーションを起動し、アプリケーションがコンパイルされて開発サーバーの準備ができるまで待ちます。

  3. リストから自動生成されたアプリケーションのデバッグ構成を選択し、リストの横にある the Debug button をクリックします。

    Start debugger for Vue.js app created with Vue CLI

localhost で実行されているアプリケーションをデバッグする

  1. コードにブレークポイントを設定します。

  2. 上記のように開発モードでアプリケーションを起動し、アプリケーションがコンパイルされて開発サーバーの準備ができるまで待ちます。

  3. 実行ツールウィンドウまたはターミナルには、アプリケーションが実行されている URL が表示されます。デフォルトでは http://localhost:8080/ です。 Ctrl+Shift を押したまま、この URL リンクをクリックします。IntelliJ IDEA は、タイプ JavaScript デバッグの自動生成されたアプリケーションのデバッグ構成でデバッグセッションを開始します。

    Starting a debugging session from the Run tool window

カスタム URL で実行されているアプリケーションをデバッグする

  1. コードにブレークポイントを設定します。

  2. 上記のように開発モードでアプリケーションを起動し、アプリケーションがコンパイルされて開発サーバーの準備ができるまで待ちます。

  3. 実行ツールウィンドウまたはターミナルには、アプリケーションが実行されている URL が表示されます。この URL アドレスをコピーします。後でデバッグ構成で指定します。アプリケーションを表示するには、リンクをクリックしてください。

  4. JavaScript デバッグ構成を作成します。これを行うには、メインメニューの実行 | 実行構成の編集に移動し、the Add icon をクリックして、リストから JavaScript デバッグを選択します。実行 / デバッグ構成: JavaScript デバッグダイアログで、保存した URL を URL フィールドに貼り付け、構成を保存します。

  5. 新しく作成した構成を起動するには、構成のリストから構成を選択し、リストの横にある the Debug button をクリックします。

最初のブレークポイントに到達したら、デバッグツールウィンドウに切り替えて通常どおり続行します。プログラムをステップ実行し、プログラムの実行を停止して再開し、中断したときにそれを調べ、コールスタックと変数を調べ、ウォッチを設定し、変数を評価し、実際の HTML DOM を表示します

関連ページ:

実行 / デバッグ構成: NPM | IntelliJ IDEA

このダイアログで、npm および Yarn スクリプトをローカルで実行するための構成を作成します。現在のコンテキストでの「ローカル」とは、IntelliJ IDEA 自体がコンピューターにインストールされた Node.js を開始し、スクリプトの実行を開始することを意味します。npm、pnpm、Yarn の詳細を参照してください。始める前に:Node.js をダウンロードしてインストールします。npm もインストールされ、それを使用する場合は準備完了です。Yarn を使用するには、Yarn オフィシャル W...

プラグインを管理する | IntelliJ IDEA

プラグインは以下に示すように IntelliJ IDEA のコア機能を拡張します。バージョン管理システム、アプリケーションサーバー、およびその他のツールとの統合を提供する、さまざまな言語とフレームワークのコーディング支援サポートを追加する、ショートカットヒント、ライブプレビュー、ファイルウォッチャーなどで生産性を向上、コーディング演習と検証で新しいプログラミング言語を学ぶのに役立ちます、プラグイン設定を開く設定 / 環境設定ダイアログで、プラグインを選択します。マーケットプレースタブを使用して...

npm、pnpm、Yarn | IntelliJ IDEA

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

JavaScript ライブラリを構成する | IntelliJ IDEA

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

コードリファレンス情報 | IntelliJ IDEA

定義:IntelliJ IDEA では、タグ、クラス、フィールド、メソッド、関数などのシンボルがプロジェクトでどのように定義されているかを確認することができます。この目的のために、IDE にはクイック定義ポップアップがあります。シンボルの定義を表示するには、エディターでシンボルを選択し、を押します(またはをクリックします)。または、キーを押したまま、任意のシンボルにカーソルを合わせます。IntelliJ IDEA は、シンボルをリンクとして表示し、その定義をツールチップに表示します。このリ...

JavaScript ドキュメントの検索 | IntelliJ IDEA

IntelliJ IDEA は、標準の JavaScript API、プロジェクトからのシンボルおよびその依存関係からの参照、および外部ライブラリで定義されているシンボルへの参照を示します。ドキュメントポップアップでシンボルのドキュメントを表示したり、メソッドパラメーターに関する情報を入手したり、それらへのリンクがある場合は外部サイトでドキュメントを開くことができます。プロジェクトシンボルまたはプロジェクト依存のシンボルの場合、IntelliJ IDEA は対応する JSDoc コメントからドキュ...