highlight HTML inside JavaScript strings in Sublime
Is there any Sublime package to syntax-highlight HTML inside JavaScript strings?
(Note the question is only about HTML inside JS strings, not syntax highlighting in general.)
Specifically I am writing Angular components using inline templates
angular.module('compMod', []).component('myComp', {
template: `<div>Some Text</div>`
});
and looking to highlight HTML syntax inside the ES6 template strings.
As @Calvin commented above, I wouldn't say this is a good practice, yet I wouldn't necessarily say it's entirely bad one. Anyways, here's my naive solution (haven't tested it for any edge cases):
Install babel package for sublime text and choose it as the default syntax for your your *.js files.
Next, edit JavaScript (Babel).sublime-syntax
, which is located inside the Babel package directory, eg ~/.config/sublime-text-3/Packages/Babel/
.
Search for the section template-string-body:
, and add at its beginning the following two lines, similar to @VRPF's suggestion:
- meta_content_scope: text.html.basic.embedded.js
- include: scope:text.html.basic
Now you have a full support in es6 + HTML syntax within template-strings.
链接地址: http://www.djcxy.com/p/90994.html