Подтвердить что ты не робот

Выделение синтаксиса Atom HTML в шаблонных литералах (для angular2)

Как я могу получить подсветку синтаксиса HTML в шаблонных литералах?

Что-то вроде этого, которое я написал для возвышенного раньше:
Вот возвышенная версия https://github.com/Microsoft/TypeScript-Sublime-Plugin/pull/189/files
Как я могу написать то же самое для Atom?

введите описание изображения здесь

4b9b3361

Ответ 1

Я смог достичь этого, вот суть для файла ts.cson.
формы атом typescript в моей системе:
/Users/amin/.atom/packages/atom-typescript/grammars/ts.cson

https://gist.github.com/aminroosta/509476f48f05f4b56db2c0748fedc8fd

Это очень полезно для разработки angular2,
вот скриншот для атома с html и css:

введите описание изображения здесь

Я не мог найти лучшее регулярное выражение для соответствия template: и styles:[, если кто-нибудь может придумать лучшее регулярное выражение, я приму их ответы.

важными изменениями в файле 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"
    }
  ]

Вот обновленный снимок экрана:

введите описание изображения здесь