How to implement language interleaving, e.g., markup inside JavaScript/CSS inside a script/style tag inside markup?

Answered

My custom language plugin includes an HTML-based markup language with additional templating tags and an embedded expression syntax. I've had that all working for a very long time using a MultiplePsiFilesPerDocumentFileViewProvider and a combination of FileNSInfoProvider/TagNameProvider/ElementDescriptorProvider/AttributeDescriptorsProvider.

Now a user has pointed out that in commercial IDEs with full HTML/JS/CSS support, there's an issue using the templating tags insight of script/style tags, e.g.:

<apex:page>
    <script>
        <apex:repeat var="str" value="{!strs}">
            <apex:outputText value="{!str}"/>
        </apex:repeat>
    </script>
</apex:page>

The issue, of course, is that the base IDE is trying to interpret the templating markup inside the script tag as JavaScript. What I really want to happen is for it to treat it as my extended HTML dialect, but I'm not sure how to do that. I looked at using language injection but there doesn't seem to be a valid injection host.

Any thoughts on how to make this work? Thanks in advance!

2 comments
Comment actions Permalink

Hi. The best way to solve the problem is to create a new inheritor of the HtmlLexer (and likely also HtmlHighlightingLexer) for your HTML-like language and override

getScriptLanguage()

method behaviour.

You can find similar code in Vue and Angular plugins here: https://github.com/JetBrains/intellij-plugins

 

0
Comment actions Permalink

Thanks, Andrey. I'll look into that and see what I can figure out.

0

Please sign in to leave a comment.