PhpStorm 2020.2 ヘルプ

React

React は、カプセル化されたコンポーネントから複雑な対話的なユーザーインターフェースを構築するための JavaScript ライブラリです。React オフィシャル Web サイト(英語)からライブラリの詳細を学びましょう。

PhpStorm は、React と統合され、lint の設定、編集、実行、デバッグ、およびアプリケーションの保守を支援します。

始める前に

  1. お使いのコンピューターに Node.js(英語) がインストールされていることを確認してください。

  2. 設定 / 環境設定 | プラグインページで JavaScript と TypeScript バンドルプラグインが有効になっていることを確認してください。詳細については、プラグインの管理を参照してください。

新しい React アプリケーションの作成

新しい React シングルページアプリケーションの構築を開始するための推奨される方法は、PhpStorm が npx(英語) を使用してダウンロードして実行する create-react-app(英語) パッケージです。その結果、開発環境は、webpack、Babel、ESLint、およびその他のツールを使用するように事前構成されています。

もちろん、Create React App を自分でダウンロードすることも、空の PhpStorm プロジェクトを作成して React をインストールすることもできます。

create-react-app を使用した React アプリケーションの生成

  1. ようこそ画面で新規プロジェクトの作成をクリックするか、メインメニューからファイル | 新規 | プロジェクトを選択します。新規プロジェクトの作成ダイアログが開きます。

  2. 左側のペインで、React アプリを選択します。

  3. 右側のペインで:

    1. プロジェクト関連ファイルが保存されるフォルダーへのパスを指定します。

    2. Node インタープリターフィールドに、使用する Node.js インタープリターを指定します。リストから設定済みのインタープリターを選択するか、追加を選択して新しいインタープリターを設定します。

    3. create-react-app リストから、npx create-react-app を選択します。

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

  4. オプション :
    JSX の代わりに TSX を使用するには、TypeScript プロジェクトを作成するチェックボックスを選択します。PhpStorm は、アプリケーションの .tsx ファイルと tsconfig.json 構成ファイルを生成します。

  5. オプション :
    プロジェクトの生成中に、react-scripts(英語) の代わりに使用するカスタムパッケージを指定します。これは、react-scripts からフォークされたパッケージの 1 つである可能性があります(たとえば、react-awesome-scripts(英語)custom-react-scripts(英語)react-scripts-ts(英語) など)。

  6. 作成をクリックすると、PhpStorm は、必要なすべての構成ファイルを含む React -specific プロジェクトを生成し、必要な依存関係をダウンロードします。PhpStorm は、アプリケーションを実行またはデバッグするためのデフォルト設定で、npm スタートおよび JavaScript デバッグ構成も作成します。

プロジェクトの依存関係をダウンロードするには、次のいずれかの操作を行います。

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

    npm install

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

空の PhpStorm プロジェクトに React をインストールする

この場合、以下の React アプリケーションの構築の説明に従ってビルドパイプラインを自分で設定する必要があります。React オフィシャル Web サイト(英語)からプロジェクトに React を追加する方法の詳細を参照してください。

空の PhpStorm プロジェクトを作成するには

  1. ようこそ画面で新規プロジェクトの作成をクリックするか、メインメニューからファイル | 新規 | プロジェクトを選択します。新規プロジェクトの作成ダイアログが開きます。

  2. 左側のペインで、PHP 空プロジェクトを選択します。右側のウィンドウで、アプリケーションフォルダーを指定し、作成をクリックします。

空のプロジェクトに React をインストールするには

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

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

    npm install --save react react-dom

    npm、pnpm、および Yarn の説明に従って、パッケージを Node.js と NPM ページにインストールすることもできます。

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

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

既にマシン上にあるアプリケーションソースを開きます

  • ようこそ画面で開くをクリックするか、メインメニューからファイル | ディレクトリを開くを選択します。開いたダイアログで、ソースが保存されているフォルダーを選択します。

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

  1. ようこそ画面でバージョン管理から取得をクリックするか、メインメニューから VCS | バージョン管理から取得を選択します。

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

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

コードの補完

PhpStorm は、React API および JSX(英語) 用のコード補完を JavaScript コードで提供します。コード補完は、React メソッド、React 固有属性、HTML タグとコンポーネント名、React イベント(英語)、コンポーネントプロパティなどで機能します。React オフィシャル Web サイト(英語)の詳細を参照してください。

React メソッドのコード補完および React 固有属性を取得するには、プロジェクトのどこかに react.js ライブラリファイルが必要です。通常、ライブラリはすでに node_modules フォルダーにあります。

React のメソッド、属性、およびイベントの補完

デフォルトでは、入力時にコード補完ポップアップが自動的に表示されます。例:

Completion popup

JSX タグでは、PhpStorm は classNameclassID などの React 固有属性(英語)、および keyref などの非 DOM 属性(英語)のコーディング支援を提供します。さらに、自動補完は、プロジェクトの CSS ファイルで定義されているクラスの名前に対しても機能します。

Completion for class names

onClickonChange などのすべての React イベント(英語)は、波括弧 ={} と一緒に自動的に補完させることもできます。

Complete React events

また、波括弧内の JavaScript 式の補完も可能です。これは、定義したすべてのメソッドと関数に適用されます。

Completing JavaScript expressions inside curly braces

HTML タグとコンポーネント名の完成

PhpStorm は、JavaScript や他のコンポーネントのメソッドの内部で定義した HTML タグとコンポーネント名に対してコード補完を提供します。

Completion for HTML tags and component names

補完は、ES6 形式の構文を持つインポートされたコンポーネントに対しても機能します。

Completion for imported components with ES6 syntax

コンポーネントプロパティの完成

PhpStorm は、propTypes を使用して定義されたコンポーネントプロパティに対してコード補完を提供し、それらの定義を迅速にジャンプまたはプレビューできるように解決します。

Completion for component properties

コンポーネントの名前を自動補完すると、PhpStorm は必要なすべてのプロパティを自動的に追加します。必要なプロパティの一部がコンポーネントの使用に欠落している場合、PhpStorm はそのことについて警告します。

HTML 属性を JSX に転送する

クラス属性またはイベントハンドラーを使用して HTML コードをコピーして JSX に貼り付けると、PhpStorm は自動的にこれらの属性を React 固有のものに置き換えます ( className , onClick , onChange など)

Transfer HTML to JSX

これは TSX でも機能します。

Transfer HTML to TSX

HTML コードを JSX または TSX に「そのまま」コピーするには、そのまま貼り付け Ctrl+Alt+Shift+V を使用するか、設定 / 環境設定ダイアログ Ctrl+Alt+S を開き、エディター | 一般 | スマートキー | JavaScript に移動して、HTML を JSX ファイルに貼り付けるときに属性を変換するチェックボックスをオフにします。

React コードスニペットの使用

PhpStorm には、React アプリでよく使用されるさまざまなステートメントとコードのブロックに展開する 50 を超えるコードスニペットのコレクションが付属しています。以下の例は、rcjc 省略形を使用して、新しい React コンポーネントを定義するクラスを作成する方法を示しています。

Live template for a React component

スニペットから React コード構成を作成する

  • 必要な省略形をエディターに入力し、Tab を押します。

  • Ctrl+J を押して、関連するスニペットを選択します。検索を絞り込むには、略語の入力を開始し、補完リストから選択します。

詳細はライブテンプレートを参照してください。

使用可能なすべての React スニペットのリストを表示します

  • 設定 / 環境設定ダイアログ Ctrl+Alt+S で、エディターライブテンプレートをクリックしてから、 React ノードを展開します。

JSX で Emmet を使用する

PhpStorm では、HTML だけでなく、特別な React twists を利用して JSX コードでも Emmet(英語) を使用できます。例:略語 div.my-class は JSX では <div className= ” my-class "></div> に展開されますが、HTML のように <div class= ” my-class" ></div> には展開されません。

Expand Emmet template in React

React アプリケーションをナビゲートする

基本的なナビゲーションの他に、PhpStorm は React 固有コード要素間をジャンプできます。

  • 波括弧 {} 内のメソッドまたは JavaScript 式の宣言にジャンプするには、メソッドまたは式を選択して Ctrl+B を押します。

  • コンポーネントの宣言にジャンプするには、コンポーネント名を選択して Ctrl+B を押します。宣言とその型に移動する詳細を参照してください。

  • コンポーネント定義を表示するには、Ctrl+Shift+I を押します。

    View quick definition of a component in a popup
    View quick definition of a component in a popup
  • コンポーネントの簡単なドキュメントを表示するには、Ctrl+Q を押します。JavaScript ドキュメントの検索の詳細を参照してください。

    Quick documentation popup for React component
  • PhpStorm を使用すると、パンくずリストを使用して JSX タグを簡単にナビゲートしたり、エディターのガターでタグツリーをカラフルに強調表示したりできます。詳細については、パンくずリストでナビゲートするを参照してください。

    Highlighting and breadcrumbs for JSX tags in a React application

Lint React アプリケーション

JavaScript および HTML 用のすべての PhpStorm 組み込みコードインスペクションも JSX コードで機能します。PhpStorm は、未使用の変数と関数、閉じタグの欠落、ステートメントの欠落などの場合に警告を出します。

JavaSxript inspections in React application

いくつかのインスペクションのために PhpStorm はクイックフィックスを提供します。たとえば、欠落しているメソッドを追加することを提案します。クイックフィックスポップアップを表示するには、Alt+Enter を押します。

インスペクションのリストをカスタマイズするには、設定 / 環境設定ダイアログ Ctrl+Alt+S を開き、エディターに移動します。インスペクション、および表示したくないインスペクションを無効にするか、重大度レベルを変更します。インスペクションの無効化と有効化およびインスペクションの重大度の構成から詳細を参照してください。

ESLint を使用する

組み込みコードインスペクションを提供するほかに、PhpStorm は JSZ コード用の ESLint(英語) などの linter と統合されています。ESLint は、lint の広範なルールを提供し、プラグインでも拡張できます。PhpStorm は、ESLint によって報告された警告とエラーを入力時にエディターに表示します。ESLint では、JavaScript 標準スタイル(英語)を使用することもできます。

詳細は ESLint を参照してください。

ESLint に React JSX 構文を正しく理解させるには、eslint-plugin-react(英語) が必要です。このプラグインでは、表示名が React コンポーネントに設定されていない場合や、危険な JSX プロパティが使用されている場合など、警告が表示されます。

ESLint with React: errors and warnings are highlighted, the description of a problem is shown in a tooltip.

React プロジェクトに ESLint をインストールして構成する

  1. 組み込みターミナル表示 | ツールウィンドウ | ターミナル)で、次のように入力します。

    npm install --save-dev eslint
    npm install --save-dev eslint-plugin-react
  2. ESLint 構成ファイル .eslintrc.* をプロジェクトに追加します。これは、.eslintrc.eslintrc.json、または .eslintrc.yaml ファイル、またはサポートされている別の形式のファイルです。詳細については、ESLint 公式 Web サイト(英語)を参照してください。

  3. 設定 / 環境設定ダイアログ Ctrl+Alt+S で、言語およびフレームワーク | JavaScript | コード品質ツール | ESLint に移動し、自動 ESLint 構成を選択します。PhpStorm は、プロジェクトの node_modules フォルダーで ESLint を自動的に検索し、.eslintrc.* ファイルまたは package.jsoneslintConfig プロパティのデフォルト構成を使用します。

    または、手動 ESLint 構成を選択して、カスタム ESLint パッケージと構成を使用します。

    詳細は PhpStorm での ESLint のアクティブ化と構成を参照してください。

.eslintrc 構造体の例 (react プラグイン付き ESLint 1.x)

  1. ecmaFeatures オブジェクトに "jsx" = true を追加します。ここでは、ES6 クラス、モジュールなど、使用したい追加の言語機能も指定できます。

  2. plugins オブジェクトに、react を追加します。

  3. rules オブジェクトでは、有効にする ESLint ビルトインルール(英語)と、react プラグインを介して利用可能なルール(英語)をリストできます。

    { "parser" : "babel-eslint", "env" : { "browser" : true } , "ecmaFeatures" : { "jsx" : true } , "plugins" : [ "react" ], "rules" : { "semi" : 2 } }

ESLint 公式 Web サイト(英語)から ESLint および react プラグイン構成の詳細を学びましょう。

React アプリケーションのリファクタリング

一般的な PhpStorm リファクタリングに加えて、React アプリケーションでは、React コンポーネントに対して名前変更を実行し、コンポーネントの抽出を使用して新しいコンポーネントを作成することもできます。

コンポーネントの名前を変更する

以下は、1 つのファイルで定義されて使用されるコンポーネントの名前を変更する例です。

Rename component used in one file

同じ方法で、1 つのファイルで定義されたコンポーネントの名前を変更し、名前付きエクスポートを使用して別のファイルにインポートすることもできます。

Rename a component defined in another file and imported through a named import
  1. コンポーネント名の中にキャレットを置き、Shift+F6 を押すか、メインメニューから、またはコンテキストメニューからリファクタリング | 名前の変更を選択します。

  2. React の命名規則(英語)に準拠した新しいコンポーネント名を指定します。

コンポーネントを抽出する

既存のコンポーネントの render メソッドから JSX コードを抽出することにより、新しい React コンポーネントを作成できます。新しいコンポーネントは、関数またはクラスとして定義できます。React 公式 Web サイトの関数とクラスのコンポーネント(英語)を参照してください。

Extract a React component
  1. 抽出するコードを選択し、コンテキストメニューからリファクタリング | コンポーネントの抽出を選択します。

    または、メインメニューのリファクタリング | 抽出 / 紹介 | コンポーネントの抽出に移動するか、Ctrl+Alt+Shift+T を押してポップアップからコンポーネントの抽出を選択します。

  2. 開いたダイアログで、新しいコンポーネントの名前とそのタイプを指定します。デフォルトでは、機能コンポーネントが作成されます。新しいコンポーネントをクラスとして定義する場合は、クラスを選択します。

  3. OK をクリックします。新しいコンポーネントは、既存のコンポーネントの隣に定義され、そこで使用されます。

  4. オプション : シンボルの移動リファクタリングを使用して、新しいコンポーネントと必要なすべてのインポートを別のファイルに移動します。

  5. オプション : PhpStorm が新しいコンポーネントに使用するコードテンプレートを変更します。設定 / 環境設定ダイアログ Ctrl+Alt+Sエディター | ファイルおよびコードテンプレートに移動し、コードタブを開き、必要に応じて Apache Velocity テンプレート言語(英語)を使用してテンプレートを更新します。

関数をクラスコンポーネントに変換する

クラスコンポーネントに変換リファクタリングを使用すると、PhpStorm は変換する関数の名前を持つ ES6 クラスを生成します。このクラスは React .Component を拡張し、関数本体が移動される render() メソッドを含みます。React オフィシャル Web サイト(英語)の詳細を参照してください。

Convert a function to a class component
  • 変換するキャレットを関数内の任意の場所に置き、メインメニューまたはコンテキストメニューからリファクタリング | クラスコンポーネントに変換を選択します。

  • または、Ctrl+Alt+Shift+T を押して、ポップアップからクラスコンポーネントに変換を選択します。

クラスを機能コンポーネントに変換する

関数コンポーネントに変換リファクタリングを使用すると、PhpStorm は変換するクラスの名前で関数を生成し、render() メソッドの内容を関数本体に移動します。

Convert a class to a functional component
  • 変換するクラス内の任意の場所にキャレットを置き、メインメニューまたはコンテキストメニューからリファクタリング | 関数コンポーネントに変換を選択します。

  • または、Ctrl+Alt+Shift+T を押して、ポップアップから関数コンポーネントに変換を選択します。

React アプリケーションでの構造化

構造化を使用すると、配列やオブジェクトの値を変数に簡単に展開できます。この機能には非常に簡潔な構文があり、アプリケーションでデータを渡す必要があるときによく使用されます。

React クラスコンポーネントを使用する場合は、オブジェクト / 配列の破壊を導入するインテンションアクションの使用を検討してください。JavaScript での構造化の詳細を参照してください。

Destructuring with intention action: Introduce object destructuring in a React class

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

新しい React シングルページアプリケーションの構築を開始するための推奨される方法は、React アプリケーションを作成(英語)します。この場合のみ、開発環境は webpack および Babel を使用するように事前構成されています。それ以外の場合は、最初にビルドパイプライン構成する必要があります。

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

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

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

React アプリケーションを実行する

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

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

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

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

    React app is running

React アプリケーションをデバッグする

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

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

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

    Start debugging an React app with Debug Application configuration

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

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

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

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

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

    Start debugging a React app from the Run tool window

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

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

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

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

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

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

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

React アプリケーションの構築

既存の PhpStorm プロジェクトに Reactインストールした場合は、ビルドプロセスを設定する必要があります。React オフィシャル Web サイト(英語)から React アプリケーションのビルドパイプラインを構成するさまざまな方法について説明します。

React アプリケーションのテスト

React アプリケーション create-react-app で作成Jest テスト(英語)を実行およびデバッグできます。開始する前に、package.json依存関係オブジェクトに react-scripts パッケージが追加されていることを確認してください。

Jest テストは、実行 / デバッグ構成を使用して、またはエディターから、またはプロジェクトツールウィンドウから Jest テストを実行してデバッグすることができます。詳しくは、Jest を参照してください。

Jest 実行 / デバッグ構成を作成する

  1. 実行 / デバッグ構成ダイアログ(メインメニューの実行 | 構成の編集)を開き、左側のペインでthe Add buttonをクリックして、リストから Jest を選択します。実行 / デバッグ構成 : Jest ダイアログが開きます。

  2. 使用するノードインタープリターとアプリケーションの作業ディレクトリを指定します。デフォルトでは、作業ディレクトリフィールドにプロジェクトのルートフォルダーが表示されます。この定義済み設定を変更するには、目的のフォルダーへのパスを指定するか、リストから以前に使用したフォルダーを選択します。

  3. Jest パッケージフィールドに、react-scripts パッケージへのパスを指定します。

  4. Jest オプションフィールドに --env=jsdom と入力します。

    Testing React: Jest run configuration

テストの実行

  1. メインツールバーのリストから Jest 実行 / デバッグ構成を選択し、リストの右側にあるthe Run iconをクリックします。

    ws_select_run_configuration_jest.png

  2. テストサーバーは自動的に起動します。実行ツールウィンドウで、テストサーバーからのメッセージを表示および分析します。

  3. 実行ツールウィンドウのテストランナータブのテスト実行の監視

デバッグテスト

  1. メインツールバーのリストから Jest 実行 / デバッグ構成を選択し、リストの右側にあるthe Debug buttonをクリックします。

  2. 開いたデバッグツールウィンドウで、通常どおり続行します。テストのステップ実行、テストの実行の一時停止と再開一時停止 時のテストの確認など。

既知の制限

デバッグセッション中に初めてアプリケーションを開くと、ページのロード時に実行されるコード内のブレークポイントの一部がヒットしないことがあります。その理由は、元のソースコードでブレークポイントを停止するには、PhpStorm がブラウザからソースマップを取得する必要があるからです。ただし、ブラウザは、ページが少なくとも 1 回は完全に読み込まれた後にのみ、これらのソースマップを渡すことができます。この問題を回避するには、ブラウザでページをリロードしてください。

最終更新日 :

関連ページ:

プラグインを管理する

プラグインは PhpStorm のコア機能を拡張します。彼ら:バージョン管理システム、アプリケーションサーバー、およびその他のツールとの統合を提供する、さまざまな言語とフレームワークのコーディング支援サポートを追加する、ショートカットヒント、ライブプレビュー、ファイルウォッチャーなどで生産性を向上、...

新規プロジェクトの作成ダイアログ

ファイル | 新規プロジェクトようこそ画面 | 新規プロジェクトの作成このダイアログを使用して、空のプロジェクトの作成、PhpStorm ワークショッププロジェクトの作成、またはアプリケーション開発用のフレームワーク固有のプロジェクトスタブの生成を行います。ダイアログの左側のペインには、ス...

npm、pnpm、および Yarn

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

コード補完

このセクションでは、コーディングプロセスのスピードアップを可能にするコンテキスト対応コード補完のさまざまなテクニックについて説明します。基本補完 :基本コード補完は、可視性スコープ内のクラス、メソッド、およびキーワードの名前を完成させるのに役立ちます。コード補完を呼び出すと、PhpStorm はコン...

ソースコードナビゲーション

さまざまなアクションやポップアップを使用して、エディター内のコードを素早くナビゲートすることができます。エディターウィンドウとツールウィンドウ間の移動に関する詳細情報については、エディターの基本を確認してください。PhpStorm で利用可能なナビゲーションオプションをチェックするためにビデオチュー...

JavaScript ドキュメントの検索

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