atom html模块,模板文字中的Atom HTML语法高亮(对于angular2)

我能够实现这一点,这是ts.cson文件的要点.

在我的系统上形成atom typescript插件：

/Users/amin/.atom/packages/atom-typescript/grammars/ts.cson

这对于角度2开发非常有用,

这里是一个截图为atom与html和css的亮点：

我找不到更好的正则表达式来匹配模板：和样式：[如果有人可以想出一个更好的正则表达式,我会接受他们的答案.

ts.cson文件中的重要变化是：

"template-html":

name: "Meta.template.html.ts"

begin: "`"

beginCaptures:

"0":

name: "string.quoted.template.ts"

end:"`"

endCaptures:

"0":

name: "string.quoted.template.ts"

patterns: [

{

include: "text.html.basic"

}

]

"template-css":

name: "Meta.template.css.ts"

begin: "`/\\*\\*/"

beginCaptures:

"0":

name: "string.quoted.template.ts"

end:"`"

endCaptures:

"0":

name: "string.quoted.template.ts"

patterns: [

{

include: "source.css"

}

]

更新：

找到一个解决方案：

"template-html":

name: "Meta.template.html.ts"

begin: "(?<=template\\:)\\s*`"

beginCaptures:

"0":

name: "string.quoted.template.ts"

end:"`"

endCaptures:

"0":

name: "string.quoted.template.ts"

patterns: [

{

include: "text.html.basic"

}

]

"template-css":

name: "Meta.template.css.ts"

begin: "(?<=styles\\:)\\s*(\\[)\\s*(`)"

beginCaptures:

"2":

name: "string.quoted.template.ts"

end:"`"

endCaptures:

"0":

name: "string.quoted.template.ts"

patterns: [

{

include: "source.css"

}

]

这是更新的截图：