Last active
June 20, 2019 21:01
-
-
Save bmomberger-bitovi/9a1d3b89042456f1188158389250de66 to your computer and use it in GitHub Desktop.
A TextMate-compatible syntax highlighter for DoneJS .component files (requires LESS and Mustache highlighters -- see comments)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?xml version="1.0" encoding="UTF-8"?> | |
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> | |
<plist version="1.0"> | |
<dict> | |
<key>fileTypes</key> | |
<array> | |
<string>component</string> | |
</array> | |
<key>firstLineMatch</key> | |
<string><(?i:can-component)</string> | |
<key>name</key> | |
<string>DoneJS Component</string> | |
<key>patterns</key> | |
<array> | |
<dict> | |
<key>begin</key> | |
<string>(?:^\s+)?(<)((?i:style))\b(?![^>]*/>)(?=.*type=['"](?:text/)?less['"])</string> | |
<key>beginCaptures</key> | |
<dict> | |
<key>1</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.tag.begin.html</string> | |
</dict> | |
<key>2</key> | |
<dict> | |
<key>name</key> | |
<string>entity.name.tag.style.html</string> | |
</dict> | |
</dict> | |
<key>end</key> | |
<string>(?<=</(?:[sS][tT][yY][lL][eE]))(>)(?:\s*\n)?</string> | |
<key>endCaptures</key> | |
<dict> | |
<key>2</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.tag.html</string> | |
</dict> | |
</dict> | |
<key>name</key> | |
<string>meta.tag.style.html</string> | |
<key>patterns</key> | |
<array> | |
<dict> | |
<key>include</key> | |
<string>text.html.basic#tag-stuff</string> | |
</dict> | |
<dict> | |
<key>begin</key> | |
<string>(?<!</(?:[sS][tT][yY][lL][eE]))(>)</string> | |
<key>captures</key> | |
<dict> | |
<key>1</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.tag.begin.html</string> | |
</dict> | |
<key>2</key> | |
<dict> | |
<key>name</key> | |
<string>entity.name.tag.style.html</string> | |
</dict> | |
</dict> | |
<key>end</key> | |
<string>(</)((?i:style))</string> | |
<key>contentName</key> | |
<string>source.less.embedded.html</string> | |
<key>patterns</key> | |
<array> | |
<dict> | |
<key>begin</key> | |
<string>/\*</string> | |
<key>captures</key> | |
<dict> | |
<key>0</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.comment.css</string> | |
</dict> | |
</dict> | |
<key>end</key> | |
<string>\*/|(?=</[sS][tT][yY][lL][eE])</string> | |
<key>name</key> | |
<string>comment.block.css</string> | |
</dict> | |
<dict> | |
<key>include</key> | |
<string>source.less</string> | |
</dict> | |
</array> | |
</dict> | |
</array> | |
</dict> | |
<dict> | |
<!--this part copied/adapted from the HTML tmLanguage--> | |
<key>begin</key> | |
<string>(?:^\s+)?(<)((?i:script))\b(?![^>]*/>)(?=.*type=["'](?:view-model|events)['"])</string> | |
<key>beginCaptures</key> | |
<dict> | |
<key>1</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.tag.begin.html</string> | |
</dict> | |
<key>2</key> | |
<dict> | |
<key>name</key> | |
<string>entity.name.tag.script.html</string> | |
</dict> | |
</dict> | |
<key>end</key> | |
<string>(?<=</([sS][cC][rR][iI][pP][tT]))(>)(?:\s*\n)?</string> | |
<key>endCaptures</key> | |
<dict> | |
<key>2</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.tag.html</string> | |
</dict> | |
</dict> | |
<key>name</key> | |
<string>meta.tag.script.html</string> | |
<key>patterns</key> | |
<array> | |
<dict> | |
<key>include</key> | |
<string>text.html.basic#tag-stuff</string> | |
</dict> | |
<dict> | |
<key>begin</key> | |
<string>(?<!</(?:[sS][cC][rR][iI][pP][tT]))(>)</string> | |
<key>captures</key> | |
<dict> | |
<key>1</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.tag.end.html</string> | |
</dict> | |
<key>2</key> | |
<dict> | |
<key>name</key> | |
<string>entity.name.tag.script.html</string> | |
</dict> | |
</dict> | |
<key>end</key> | |
<string>(</)((?i:script))</string> | |
<key>contentName</key> | |
<string>source.js.embedded.html</string> | |
<key>patterns</key> | |
<array> | |
<dict> | |
<key>captures</key> | |
<dict> | |
<key>1</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.comment.js</string> | |
</dict> | |
</dict> | |
<key>match</key> | |
<string>(//).*?((?=</[sS][cC][rR][iI][pP][tT])|$\n?)</string> | |
<key>name</key> | |
<string>comment.line.double-slash.js</string> | |
</dict> | |
<dict> | |
<key>begin</key> | |
<string>/\*</string> | |
<key>captures</key> | |
<dict> | |
<key>0</key> | |
<dict> | |
<key>name</key> | |
<string>punctuation.definition.comment.js</string> | |
</dict> | |
</dict> | |
<key>end</key> | |
<string>\*/|(?=</[sS][cC][rR][iI][pP][tT])</string> | |
<key>name</key> | |
<string>comment.block.js</string> | |
</dict> | |
<dict> | |
<key>include</key> | |
<string>source.js</string> | |
</dict> | |
</array> | |
</dict> | |
</array> | |
</dict> | |
<dict> | |
<key>include</key> | |
<string>txt.html.mustache, text.html.hgn</string> | |
</dict> | |
</array> | |
<key>scopeName</key> | |
<string>text.donejs.done-component</string> | |
<key>uuid</key> | |
<string>C9C7B041-A3DB-4F01-B43C-19ED88D302E9</string> | |
</dict> | |
</plist> |
This highlighter makes use of the HTML With Mustaches highlighter. Get it from one of the links below:
- as a Sublime Package Control package https://packagecontrol.io/packages/HTML%20Mustache
- as a TextMate bundle: https://github.com/defunkt/Mustache.tmbundle
- as standalone language files: https://github.com/Hugoch/sublimeText2-mustache
LESS comes preinstalled in Sublime Text
TextMate LESS package: https://github.com/creationix/LESS.tmbundle
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
If you are using ESLint, you may also need to set a few options for best results in the view model script area. Here's how I set up my done component options in Sublime Text: