Search code examples
javascriptphpstormwebstormemmet

How to enable Emmet in JavaScript in PhpStorm?


In JavaScript, I'm really struggling not being able to use Emmet say in literal templates or suchlike, for example to create a <div></div> tag or any code that could be abbreviated for Emmet (e.g. #div, .div, ...).

I have checked the JSX emmet and I also have tried with .jsx file prefixes instead of .js, but none have worked so far! I literally searched everywhere for a practical answer but not a single one worked for me!

How can I make it possible?

function myPrint(myVal , color = "secondary") {
    document.write(`
      div
    `)
}

There's no way I can make that div to get <div></div> with Emmet tap key.


Solution

  • EMMET only works in HTML context, you need to tell the IDE that the code in your template literal is HTML. For this, you can either inject HTML language in it temporarily via Alt+Enter:

    enter image description here

    or use injection comments:

    function myPrint(myVal, color = 'secondary') {
      // language=HTML 
      document.write(`
          div
      `)
    }