Question

I’m working with templates for a Backbone app that are stored in the HTML in <script type="text/template"> elements, but this is becoming frustrating because Sublime Text colors the HTML within a template as though it were Javascript. I’d like to get the editor to consider these script tags the same as normal HTML tags.

I’ve tried modifying the regexes in the source.js.embedded.html block on HTML.tmLanguage, but as somebody who’s inexperienced with regular expressions, I can’t get it right.

Any ideas?

This is, I believe, the relevant part of the tmLanguage file that needs to be modified:

                <key>begin</key>
                <string>(?&lt;!&lt;/(?:script|SCRIPT))(&gt;)</string>
                <key>captures</key>
                <dict>
                    <key>1</key>
                    <dict>
                        <key>name</key>
                        <string>punctuation.definition.tag.html</string>
                    </dict>
                    <key>2</key>
                    <dict>
                        <key>name</key>
                        <string>entity.name.tag.script.html</string>
                    </dict>
                </dict>
                <key>end</key>
                <string>(&lt;/)((?i:script))</string>

Answer 1

I think you should edit the other value:

        <key>begin</key>
        <string>(?:^\s+)?(&lt;)((?i:script))\b(?![^&gt;]*/&gt;)</string>
        <key>beginCaptures</key>
        <dict>
            <key>1</key>
            <dict>
                <key>name</key>
                <string>punctuation.definition.tag.html</string>
            </dict>
            <key>2</key>
            <dict>
                <key>name</key>
                <string>entity.name.tag.script.html</string>
            </dict>
        </dict>

and replace (?:^\s+)?(<)((?i:script))\b(?![^>]*/>)

with (?:^\s+)?(<)((?i:script))\b(?![^>]*/>)(?![^>]*type="text/template")