Linguist，我怎样才能重新触发 GitHub 的语法荧光笔？

Question

如何使用 Javascript 重新触发 GitHub 的语法突出显示？

在 GitHub 上查看代码文件时，有时会以某种方式调用 GitHub's Linguist。在我的 Chrome 检查器选项卡中，看起来正在加载的资产是

https://ghe.spotify.net/assets/frameworks-1ec6db7370e0fb4a44d10339aab88815d4b1b048f96a77b08f5e7166ae644496.js

（link 只能由我访问，但它已缩小且不可读。）不过，它的作用是获取每一行代码（组织为 table 行）和插入 <span> 个带有类的元素，这些元素标识应如何着色的点点滴滴。

  <tr>
    <td id="L1" class="blob-num js-line-number" data-line-number="1"></td>
    <td id="LC1" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> { <span class="pl-smi">Reference</span>, <span class="pl-smi">References</span> } <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./lib/reference<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L2" class="blob-num js-line-number" data-line-number="2"></td>
    <td id="LC2" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> { <span class="pl-smi">Decoration</span>, <span class="pl-smi">Decorations</span> } <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./lib/decoration<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L3" class="blob-num js-line-number" data-line-number="3"></td>
    <td id="LC3" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> { <span class="pl-smi">ReferenceContainerComponent</span> } <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./components/reference-container-component<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L4" class="blob-num js-line-number" data-line-number="4"></td>
    <td id="LC4" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> <span class="pl-c1">*</span> <span class="pl-k">as</span> <span class="pl-smi">React</span> <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>react<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L5" class="blob-num js-line-number" data-line-number="5"></td>
    <td id="LC5" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> <span class="pl-c1">*</span> <span class="pl-k">as</span> <span class="pl-smi">ReactDOM</span> <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>react-dom<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L6" class="blob-num js-line-number" data-line-number="6"></td>
    <td id="LC6" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> { <span class="pl-smi">DecorationsRequest</span>, <span class="pl-smi">IndexedCommitsRequest</span>, <span class="pl-smi">ReferencesRequest</span> } <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./lib/extension-message<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L7" class="blob-num js-line-number" data-line-number="7"></td>
    <td id="LC7" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> <span class="pl-c1">*</span> <span class="pl-k">as</span> <span class="pl-smi">Github</span> <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./lib/github<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L8" class="blob-num js-line-number" data-line-number="8"></td>
    <td id="LC8" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> { <span class="pl-smi">IndexedCommits</span>, <span class="pl-smi">IndexedCommit</span> } <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./lib/indexed-commit<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L9" class="blob-num js-line-number" data-line-number="9"></td>
    <td id="LC9" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> { <span class="pl-smi">ViewIndexedCommit</span> } <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./components/view-indexed-commit<span class="pl-pds">"</span></span>;</td>
  </tr>
  <tr>
    <td id="L10" class="blob-num js-line-number" data-line-number="10"></td>
    <td id="LC10" class="blob-code blob-code-inner js-file-line"><span class="pl-k">import</span> <span class="pl-c1">*</span> <span class="pl-k">as</span> <span class="pl-smi">DecorationRenderer</span> <span class="pl-k">from</span> <span class="pl-s"><span class="pl-pds">"</span>./lib/decoration-renderer<span class="pl-pds">"</span></span>;</td>
  </tr>

我正在编写一个 Chrome 扩展来修改 GitHub（准确地说，GitHub Enterprise）显示的代码。我想在扩展进行修改后运行 GitHub 的语法突出显示，但我不知道要调用什么 Javascript 函数来实现它。

我试过的：

我尝试在 Linguist's source code 中寻找提示，但我根本找不到任何 Javascript。
我尝试在 Chrome 的 Inspector 中的 <table> 上设置子树修改断点，但页面似乎根本没有中断，尽管有网络缓存选项也检查了。

Answer 1

Linguist 仅在服务器端运行，无论如何，不负责语法高亮显示。 Linguist 只检测每个文件的语言，然后returns the appropriate grammar 进行语法高亮显示。最后一步也发生在服务器端，然后缓存输出以避免为每个请求重新计算它。每次您推送到存储库时，都会触发后台作业 以检测并突出显示已修改的文件。

您可以尝试请求 GitHub 支持人员开源执行实际语法突出显示的代码。问的人越多，越有可能成为优先事项。

Linguist，我怎样才能重新触发 GitHub 的语法荧光笔？

How can I retrigger GitHub's syntax highlighter, Linguist?

javascript

github

syntax-highlighting

github-linguist