Language Injection Rule PhpStorm -> JavaScript in Twig Block

Question

I'm working with CraftCMS, which uses Twig. One of the methods I use to add JS is e.g.

{% js at endBody %}
    console.log('I am JavaScript');
{% endjs %}

I want to have it permanently highlighted as JavaScript, and not have to reinject it every time I open PhpStorm again.

According to https://www.jetbrains.com/help/phpstorm/using-language-injections.html#configure-injection-rules I need to add an injection rule. So I went to

Editor
Language Injections
Add (+)
Generic Twig
(See image)

What do I have to enter in this window though? I'm a bit lost here. Any help is valuable :)

Did you try clicking the (?) in the corner? Jetbrains's help is pretty useful... jetbrains.com/help/idea/… — AKX
– AKX, Commented Jul 26, 2021 at 13:38
@AKX no I didn't, but even after checking out the page, it wouldn't really have helped me :) — D3strukt0r
– D3strukt0r, Commented Jul 27, 2021 at 6:50

LazyOne · Accepted Answer · 2021-07-27 12:05:00Z

4

Sure, just add a pattern for matching your custom js Twig tag:

+ twigCustomStatement("js")

https://www.jetbrains.com/help/phpstorm/language-injection-settings-generic-twig.html

P.S. PhpStorm already has a bundled similar rule for script Twig tag. It does exactly the same. The only difference is in the tag name: script versus your js.

The final result (notice the light green background that indicates the Language Injection rule in action + syntax colors for JS code; shows both your tag and bundled one):

(NOTE: copy+pasting in the file, re-opening the file or the whole project/IDE may be needed to have new Injection rule to be applied)

Proof that it's a JavaScript:

edited Jul 27, 2021 at 12:05

answered Jul 26, 2021 at 15:44

LazyOne

167k49 gold badges420 silver badges422 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

D3strukt0r Over a year ago

Thank you so much. So thorough I have nothing else to say hahaha. I could have guessed that there are existing rules, but I didn't see them. I just had to reopen the files for it to apply. Closing and opening the project didn't help. Thanks

Collectives™ on Stack Overflow

Language Injection Rule PhpStorm -> JavaScript in Twig Block

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related