HTML語法高亮顯示sublime 3 Typescript

Question

我正在使用Sublime 3的TypeScript。如何在模板屬性中添加HTML高亮：[注意：我已經在使用Microsoft TypeScript Package]

看看它現在沒有突出顯示：

Answer 1

這是一個快速修復，仍然使用您安裝的TypeScript包及其現有的語法高亮定義：

1. 打開TypeScript文件（使用已安裝的TypeScript語法突出顯示）

2. 從Typescript.tmLanguage中選擇工具>開發人員>新語法，以基於現有語法定義文件創建新的語法定義文件

3. 找到template上下文（ ctrl + f for string.template.ts ）並將'scope:text.html.basic'的include添加到push如下面的注釋行所示：

    %YAML 1.2 --- # http://www.sublimetext.com/docs/3/syntax.html name: TypeScript + HTML # <-- renaming is optional # ... template: - match: "([_$[:alpha:]][_$[:alnum:]]*)?(`)" captures: 1: entity.name.function.tagged-template.ts 2: punctuation.definition.string.template.begin.ts push: - meta_scope: string.template.ts - match: "`" captures: 0: punctuation.definition.string.template.end.ts pop: true - include: template-substitution-element - include: string-character-escape - include: 'scope:text.html.basic' # <-- !! only add this line !! template-substitution-element: # ... 

   可選步驟：
   將文件開頭的name屬性更改為TypeScript + HTML以便在以后的語法列表中輕松找到並選擇它

4. 使用.sublime-syntax文件結尾保存文件

5. 重新啟動Sublime Text並將新語法突出顯示應用於typescript文件：

   

Answer 2

你可以在這里閱讀如何實現這個目標：

https://forum.sublimetext.com/t/javascript-es6-template-literals-syntax-for-html/18242

轉載於此：

打開工具>開發人員>新語法

加：

%YAML1.2
---
# See http://www.sublimetext.com/docs/3/syntax.html
name: JavaScript NG
file_extensions:
  - js
  - ng.js
scope: source.js.ng
contexts:
  main:
    - match: ""
      push: scope:source.js
      with_prototype:
      - match: '`'
        push:
          - meta_content_scope: text.html.basic.embedded.js
          - include: 'scope:text.html.basic'
          - match: '`'
          pop: true

並保存它有JavaScript-NG.sublime語法

還有一個開放的github問題：

https://github.com/sublimehq/Packages/issues/179