チュートリアル: JavaScript 内の PHP 構文のハイライト
このチュートリアルでは、PhpStorm で混在構文を扱うためにテンプレートデータ言語を使用する方法について見ていきます。 単一のファイルで異なるプログラミング言語を混在させることがあります。 そのようなインジェクションが一つか二つしかない場合は、 言語インジェクションを使用するのが適しています。 しかし、それが多数ある場合はどうでしょうか? たとえば、PHP 変数や関数を使用している JavaScript または CSS ファイルの場合はどうでしょうか? 混在構文の構文ハイライト、コード補完、インスペクションを得るにはどうすればよいでしょうか? これには便利な方法があります: テンプレートデータ言語を構成することです。
以下の JavaScript ファイルを考えてみましょう。 ファイル内では、現在のドキュメントが読み込まれたときに警告に表示する PHP 変数を使用しています。 構文エラーを発見することもできます: 変数にアクセスするために $ が欠落していました。 PhpStorm は、JavaScript コードと PHP コードの両方をどのように認識させるのですか?

PhpStorm で異なる言語を 1 つのファイルで認識させるには、次の手順を実行します。
ファイル名を変更して、PhpStorm が PHP として扱い、その拡張機能が php と異なるようにします。
新しいファイルタイプを PHP に関連付ける (または他の言語)。
テンプレートデータ言語を設定する を設定します。
ファイルの名前を変更する
最初のステップとして、ファイル名を alert.js から alert.js.php に変更します (拡張機能は任意のものにできます)。 拡張機能を変更する必要があるのはなぜですか? ハイライト、コード補完、分析がすべてのファイルで動作し続けるように、カスタム言語を含めたいファイルを他の php ファイルから分離することが不可欠です。 なぜ .js.php なのでしょうか? デプロイ後、このファイルは PHP によって実行される必要があります。 もちろん、サーバーを再構成して JavaScript ファイルを PHP インタープリター経由で実行することもできますが、現在の方法のほうがおそらく簡単です。
名前を変更した後のファイルの外観は次のとおりです。

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

この設定は IDE ワイドなので、作成されたファイルタイプの関連付けはすべてのプロジェクトに影響します。 独自の拡張機能を使用することが最善の方法です。
テンプレートデータ言語を設定する
PhpStorm は PHP 構文を認識しますが、JavaScript は認識しなくなりました。 設定 ダイアログ(Ctrl+Alt+S )で、 言語 & フレームワーク の テンプレートデータ言語 を選択します。 ここでは、特定のファイル、フォルダー、プロジェクト全体に対して第 2 言語を指定できます。 この例では、ファイルとして JavaScript を選択できます。

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