PhpStorm 2026.1 Help

チュートリアル: JavaScript 内の PHP 構文のハイライト

このチュートリアルでは、PhpStorm で混在した構文を扱うためにテンプレートデータ言語の使い方を紹介します。 時々、1つのファイルで異なるプログラミング言語を混在させることがあります。 そのようなインジェクションが少数の場合は、 言語インジェクション を使うのが最適です。 では、それがたくさんある場合はどうしますか? 例えば、PHP の変数や関数を利用する JavaScript や CSS ファイルの場合などですか? 構文ハイライト、コード補完、インスペクションを混在させるにはどうしたらよいでしょうか? このための便利な方法は、 テンプレートデータ言語を設定することです。

以下の JavaScript ファイルを考えてみましょう。 ファイル内では、現在のドキュメントが読み込まれたときに警告に表示する PHP 変数を使用しています。 構文エラーを発見することもできます: 変数にアクセスするために $ が欠落していました。 PhpStorm で JavaScript コードと PHP コードの両方を認識させるにはどうしたらよいでしょうか?

js ファイルでの混在構文のハイライト

PhpStorm で 1つのファイルの中で異なる言語を認識させるには、次の手順を実行します。

  1. ファイル名を変更し、拡張機能が php と異なっていても PhpStorm で PHP として扱われるようにします。

  2. 新しいファイルタイプを PHP (または他の言語)に関連付けます。

  3. 設定で テンプレートデータ言語を設定します。

ファイルの名前を変更する

最初のステップとして、ファイル名を alert.js から alert.js.php に変更します(拡張機能は任意です)。 なぜ拡張機能を変更する必要があるのでしょうか? すべてのファイルでハイライト、コード補完、解析が正常に動作するように、独自の言語を使用したいファイルを、他の php ファイルと分けて管理することが重要です。 なぜ .js.php なのですか? このファイルはデプロイ後、PHP で実行する必要があります。 もちろん、サーバーの設定を変更して JavaScript ファイルを PHP インタープリターで実行することもできますが、現在の方法の方が簡単でしょう。

名前を変更した後のファイルの外観は次のとおりです。

js.php ファイルでの構文のハイライトの混在

新しいファイルタイプを PHP に関連付ける

次に、新しい( js.php ファイルタイプを ファイルタイプ ページの 設定 ダイアログで PHP に関連付ける必要があります。 カスタム拡張機能を使いたくない場合は、パターンとしてファイル名全体を指定する必要がありますが、これは推奨されません。

ファイルタイプ設定ページ

この設定は IDE ワイドなので、作成されたファイルタイプの関連付けはすべてのプロジェクトに影響します。 独自の拡張機能を使用することが最善の方法です。

テンプレートデータ言語を設定する

現在、PhpStorm は PHP 構文を認識しますが、JavaScript は認識できなくなっています。 設定 ダイアログ(Ctrl+Alt+S )で、 言語 & フレームワークテンプレートデータ言語 を選択します。 ここでは、特定のファイル、フォルダー、プロジェクト全体に対して第 2 言語を指定できます。 この例では、ファイルとして JavaScript を選択できます。

テンプレートデータ言語設定ページ

テンプレートデータ言語が指定されると、PhpStorm は両方の言語を認識し、PhpStorm は構文ハイライト、コード補完、インスペクション、リファクタリングなどを提供します。

php.js の PHP インスペクション
2026 年 5 月 22 日