ウェブブラウザーとプレビュー
このページでは、次を構成できます。
Web ブラウザーのインストールを PhpStorm と統合し、PhpStorm からの Web ブラウザーの起動を有効または無効にします。
実行可能ファイルを実行するか、デフォルトのシステムコマンドを使用してブラウザーを起動するかどうかを指定します。
デフォルトで PhpStorm が要求に応じて HTML ファイルを開く デフォルトの PhpStorm ブラウザーを指定します。つまり、ブラウザーが明示的に指定されていない場合
ブラウザーで HTML または XML ファイルを開くためのブラウザーポップ上へを有効にします。
ブラウザーまたは組み込みプレビューでページを自動的に再ロードするタイミングを構成します。
ブラウザー
このセクションでは、HTML 出力のプレビューに使用できるブラウザーを指定します。このセクションでは、定義済みリストのブラウザーと、以前に設定されたカスタムブラウザーのインストール（存在する場合）を示します。
PhpStorm には、HTML ファイルの実行、デバッグ、またはプレビュー中に IDE から自動的にインストールおよび起動できる、最も一般的なブラウザーの定義済みリストが付属しています。PhpStorm は、標準の手順に従ってブラウザーをインストールすることを前提としており、各インストールに、ブラウザーの実行可能ファイルまたは macOS アプリケーションへのデフォルトパスを表すエイリアスを割り当てます。
実際のブラウザーのインストールで実行可能ファイルへのパスが異なる場合は、パスフィールドで明示的に指定する必要があります。
あらかじめ定義されたブラウザーに加えて、ツールバーのコントロールを使用して必要な数だけカスタムブラウザーをインストールすることができます。
項目 | 説明 |
|---|---|
アクティブ | このチェックボックスを選択して、PhpStorm からそれぞれのブラウザーを使用できるようにします。ブラウザーがメニュー項目のコンテキストメニューに追加され、そのアイコンがブラウザーアイコンポップ上へに表示されます。 このチェックボックスがオフの場合、対応するブラウザーアイコンはアイコンツールバーまたはポップ上へに表示されません。 |
名前 | この列には、ブラウザー名を指定します。 |
ファミリ | この列には、ブラウザーが属するファミリを指定します。 |
パス | この列で、実行可能ファイルへのパスを指定します。ブラウザーが標準のインストール手順に従ってインストールされた場合、おそらくパスフィールドのエイリアスは正しい場所を指しています。そうでない場合は、 |
をクリックして、開いたダイアログで実際のパスを選択します。開いたダイアログで、対応するブラウザーの実行可能ファイルへのパスを選択します。ツールバー
項目 | 説明 |
|---|---|
| カスタムブラウザーをリストに追加するには、このボタンをクリックします。 |
| 選択した顧客のブラウザーをリストから削除するには、このボタンをクリックします。あらかじめ定義されたリストからブラウザーを削除することはできません。 |
| このボタンをクリックすると、Firefox のカスタムプロファイルまたは Chrome ファミリのブラウザーを指定できます。このボタンは、Firefox と Chrome が選択されている場合にのみ使用できます。 Firefox 設定ダイアログで、出力のプレビューに使用する Firefox のブラウザープロファイル(英語)を指定します。
Chrome 設定ダイアログで:
|
| これらのボタンを使用して、選択したブラウザーをリスト内で上下に移動します。ブラウザーの順序は、外部リソースをレンダリングし、Web コンテンツでファイルをプレビューするために重要です。 |
| 選択したブラウザーのコピーを作成するには、このボタンをクリックします。 |
をクリックするか、Shift+Enter を押してエディターボックスを開きます。
デフォルトブラウザー
このセクションでは、外部リソースのレンダリングと Web コンテンツを含むファイルのプレビューにデフォルトで使用されるデフォルトの PhpStorm ブラウザーを指定します。メインメニューからを選択するか、ファイルのコンテキストメニューからを選択すると、コンテキストメニューではこのブラウザーはデフォルトと呼ばれます。
項目 | 説明 |
|---|---|
デフォルトブラウザー | リストからデフォルトのブラウザーを選択します。可能なオプションは次のとおりです。
|
エディターでブラウザーアイコンポップ上へを構成する
この領域で、PhpStorm に HTML ファイルまたは XML ファイルで有効なブラウザーを含むポップ上へを表示するかどうかを構成します。このポップ上へは、現在のファイルの出力をプレビューするために使用されます。
デフォルトでは、ブラウザーアイコンポップ上へは HTML ファイルでのみ表示されます。XML ファイルでは、デフォルトではポップ上へは表示されないため、注意をそらさずにコードを読んだり編集したりできます。HTML ファイル用および XML ファイル用チェックボックスを使用して、現在のファイルタイプに応じてポップ上へを表示または非表示にします。
再ロード動作
この領域で、ブラウザーまたは組み込みプレビューで HTML ページの再読み込みを自動的にトリガーするアクションを指定します。ブラウザーで HTML ファイルをプレビューするから詳細を参照してください。
ブラウザーでページを再ロードおよび組み込みプレビューでページを再ロードリストから、Web ブラウザーおよび組み込みプレビューでページの自動再ロードをトリガーするアクションを選択します。
デフォルトでは、保存時が選択されているため、ブラウザーまたは組み込みプレビューで HTML ファイルを開いた後、この HTML ファイル (またはリンクされた JavaScript ファイルまたはスタイルシートファイル) が手動または自動で保存されるたびに、PhpStorm はページを自動的に再読み込みします。変更を保存して元に戻すを参照してください。
ページの再ロードをトリガーするファイルを保存すると、PhpStorm は了解ツールチップを表示します。
変更時を選択すると、入力時にページが再読み込みされます。
ページの自動再読み込みを抑制するには、無効を選択します。
ビルトインサーバー
PhpStorm には Web サーバーが内蔵されており、Web ブラウザーでアプリケーションをデバッグしたり、PhpStorm の内蔵ブラウザーでコードをプレビューしたりできます。このサーバーは常に稼働しており、手動での設定は不要です。詳しくは IDE の組み込み Web サーバーを参照してください。
組み込みサーバーで実行されているアプリケーションをデバッグする詳細を参照してください。
項目 | 説明 |
|---|---|
ポート | このスピンボックスを使用して、組み込み Web サーバーが実行されるポートを指定します。デフォルトでは、このポートは 63342 に設定されており、PhpStorm はこれを介してサービスからの接続を受け入れます。ポート番号は 1024 以降の任意の値に設定できます。 |
外部接続を受け入れ可能 | このチェックボックスを選択すると、指定したポートで実行されている組み込みサーバー上のファイルに別のコンピューターからアクセスできます。 このチェックボックスがオフになっている場合（デフォルト）、デバッガーはローカル接続のみをリッスンします。 |
署名されていない要求を許可する | セキュリティ上の理由から、PhpStorm 外部からの組み込みサーバー上のページへのリクエストはデフォルトで拒否され、ページ 404 が表示されます。 要求されたページへのアクセスを許可するには、署名されていない要求を許可するチェックボックスを選択します。 |
関連ページ：
IDE の組み込み Web サーバー
PhpStorm には Web サーバーが内蔵されており、Web ブラウザーでアプリケーションをデバッグしたり、PhpStorm の内蔵ブラウザーでコードをプレビューしたりできます。このサーバーは常に稼働しており、手動での設定は不要です。組み込みサーバーは、初期状態では HTML、JavaScript、CSS などの静的コンテンツのみを提供します。PHP ファイルで使用するには、プロジェクト用に指定されたローカル PHP インタープリターが必要です。インタープリターが設定されると、PhpStor...
HTML
PhpStorm は、構文やエラーのハイライト、コードスタイルに応じたフォーマット、構造検証、コード補完、デバッグセッション中のオンザフライプレビュー（ライブ編集）やコードエディターの専用プレビュータブなど、HTML を強力にサポートします。HTML ツールプラグインを有効にするこの機能は、デフォルトで PhpStorm にバンドルされて有効になっている HTML ツールプラグインに依存しています。関連する機能が利用できない場合は、プラグインを無効にしていないことを確認してください。を押して設定を...
コードの実行 / デバッグ
簡単な方法：プログラムにパラメーターを渡さず、プログラムの開始前にアクションを実行する必要がない場合は、一時的な構成を使用してエディターまたはツールバーからプログラムを実行 / デバッグできます。現在のファイルを実行するエディターでファイルを開き、次のいずれかのオプションを使用して実行します。エディター領域の任意の場所を右クリックしてコンテキストメニューを開き、そこから実行および <script name> を選択します。エディターの上にあるツールバーで、ドロップダウンメニューから現在...
PhpStorm を使用したデバッグ
クイックスタート：以下は、ローカルまたはリモート Web サーバー上で実行される PHP アプリケーションをデバッグするために PhpStorm と Xdebug 3 を使用するためのクイックスタートガイドです。PHP テストのデバッグや SSH 経由のリモートデバッグなどの他のデバッグシナリオについては、デバッグシナリオを参照してください。1. Xdebug をインストールする Xdebug デバッグエンジンは PHP の拡張機能であるため、アプリケーションが実行されるローカルまたはリモート...
Chrome での JavaScript のデバッグ
PhpStorm は、client-sideJavaScript コード用の組み込みデバッガーを提供します。以下の手順では、このデバッガーの使用を開始するための基本的な手順を説明します。始める前に：設定で JavaScript and TypeScript バンドルプラグインが有効になっていることを確認します。を押して設定を開き、を選択します。インストール済みタブをクリックします。検索フィールドに JavaScript and TypeScript と入力します。プラグインの詳細については、プラグイ...