How can I configure PhpStorm so it recognizes javascript with embedded php

Question

In my framework I can have javascript files with embedded php.

For example

$(document).ready(function(){
   alert(<?php echo $message ?>);
});

How can I let PhpStorm detect the right languages so both javascript and php get correct syntax highlighting?

Answer 1

UPDATE 2023-04-24

As PhpStorm v9 (which is year 2015 or so), the IDE automatically detects the outer language if double file extension is used (the actual ticket: WI-24237).

So if your file is named some.js.php then it will automatically use JavaScript with PHP and there is no need for steps #2 and #3.

---

Three steps:

1. Give such a file custom (e.g. *.phpjs) or complex (*.js.php or *.php.js) file extension.

2. If the file extension does NOT end in .php then assign such a pattern to PHP file type in Settings/Preferences | File Types. This is needed so the file is treated as PHP (otherwise you will have no PHP syntax highlighting).

   • If you do not want to give it such custom extension (for whatever reasons you may have there) then you'll have to assign full file name as a pattern (which can cause issues/confusion if you have another file with the same file name in another folder, even in another project).
   • Please note -- this is an an IDE-wide setting so it will affect all projects and therefore custom/complex extension is the best and safe way to go (since it's more universal).

3. Settings/Preferences | Languages & Frameworks | Template Data Languages -- locate your file there and assign JavaScript to it (or whole folder, if all files in it will be treated similarly) -- this will set JavaScript as primary (outer) language instead of default HTML.

(PHP & JavaScript syntax colors + showing a tooltip for JavaScript's alert() function in a file named some.js.php)