為Google的Prettify創建自己的規則的最新方法是什么？

Question

為Google的Prettify創建自己的規則的最新方法是什么？

我不是在談論更改現有規則的顏色，此外，我想創建新規則：

• 例如用於外殼/打擊
• 也許是在一首詩的極端案例中，我想以粗體顯示“ love”一詞的所有出現

或者我想顯示一棵樹並將所有spec.ts文件標記為粗體，例如：

├── src
    │   ├── app
    │   │   ├── app-routing.module.ts
    │   │   ├── app.component.css
    │   │   ├── app.component.css.map
    │   │   ├── app.component.html
    │   │   ├── app.component.scss
    │   │   ├── app.component.spec.ts
    │   │   ├── app.component.ts
    │   │   ├── app.module.ts
    │   │   └── lesson
    │   │       ├── lesson.component.css
    │   │       ├── lesson.component.css.map
    │   │       ├── lesson.component.html
    │   │       ├── lesson.component.scss
    │   │       ├── lesson.component.spec.ts
    │   │       └── lesson.component.ts

Answer 1

最簡單的方法是從現有示例開始工作。

如果查看該文件，則可以看到該文件有一些樣板文件，它們圍繞着兩個元組列表：

PR['registerLangHandler'](
    PR['createSimpleLexer'](
        [
          // Some tuples
        ],
        [
          // Some more tuples
        ],
        [/* Some file extensions without dot */]));

如果文件擴展名列表包含"ext"並且要求prettify使用class="lang-ext ..."對一個代碼塊進行美化，則將使用此處理程序。

兩組元組具有相似的結構。 這是第一組的一些

['opn',             /^\(+/, null, '('],
['clo',             /^\)+/, null, ')'],

這是第二組中的一個。

[PR['PR_KEYWORD'],     /^(?:block|c[ad]+r|catch|con[ds]|def(?:ine|un)|do|eq|eql|...)\b/, null],

PR['PR_KEYWORD']是預定義的令牌類型，並且與預定義樣式表中的樣式匹配：

.kwd { color: #008 }  /* a keyword */

什么

['opn',             /^\(+/, null, '('],

意思是說，在美化時，如果代碼的開頭以/^\\(+/開頭，則輸入將被包裝在<span class="opn">...</span> opn （LISP開放括號）中是一個字符串文字，因為它沒有預定義的常量，如果您定義自己的令牌類型類，則可能必須在任何加載頁面的頁面中為其定義樣式規則。

右側的字符串'('被視為字符列表，因此當輸入文本以這些字符之一開頭時，此規則是唯一適用的規則。這是IE 6多年來的重要優化。

兩組元組之間的唯一區別是，第一個列表中的元組具有此額外的排他字符元素。

IIRC， null支持一項功能，該功能很少被發現，並且不再受支持。 您放置在該位置的任何值都將被忽略。

CSS處理程序對此有一些文檔，並演示了另一個功能。

['lang-css-kw', /^(-?(?:[_a-z]|(?:\\[0-9a-f]+ ?))(?:[_a-z0-9\-]|\\(?:\\[0-9a-f]+ ?))*)\s*:/i],

如果令牌類型以lang-開頭，而不是生成<span class="lang-css-kw">...</span> ，則prettify將尋找文件擴展名css-kw的語言處理程序並將其應用遞歸地使用第1組中的內容。由於現代JS引擎始終支持先行，因此此功能可能是過大的，但是必須這樣做，HTML模式才能將JS和CSS模式遞歸地應用於<script>和<style>塊的內容。

---

Prettify可以處理僅依賴於令牌從左到右傳遞的任何轉換。 它沒有辦法為清除歧義而在邊表中收集符號，因此無法區分這兩個C代碼段：

typedef int t  // t is declared as a type
t* x;   // declare x as a pointer to a t. "t" should have class="typ"

從

int t = 1;  // t is declared as a variable, not a type
t* x;   // multiplication.  "t" should not have class="typ"

面對您經常在類似stackoverflow之類的網站上看到的少量代碼片段和格式錯誤的代碼，這種有限的方法似乎更健壯。

對常見的語言約定進行編碼是合理的，例如

• 類型名稱以大寫字母開頭
• 以_t結尾的標識符是類型

在你的規則中。