gpt4 book ai didi

javascript - 如何在 Jekyll 3 中为 rouge 指定自定义语言解析器别名?

转载 作者:行者123 更新时间:2023-12-04 02:35:58 31 4
gpt4 key购买 nike

如何配置 Jekyll & Rouge 来指定一种语言应该使用另一种语言的解析器突出显示。

例如,我希望能够在我的 markdown 源文件中执行此操作:

```nodejs-repl
> foo();
Uncaught ReferenceError: foo is not defined
```

...但是使用相同的方式突出显示该代码块语法语法荧光笔 Javascript 语言解析器。

我想这样做有几个原因:

  1. 源文件中的语义正确性
  2. 能够运行 prettier 等工具并让它们绕过这些代码块

Rouge 已经有了语言别名的概念(见下面的例子),但是是否可以通过 Jekyll 指定自定义语言别名,如果可以,如何做到这一点?


详细信息:

(1)

我正在使用 Jekyll 3.8.5 和 Rouge 3.11.0。

(2)

以下是我的 Jekyll 配置文件的相关部分:

highlighter: rouge

(3)

为了真正清楚“语言别名”指的是什么,我将提供一个示例:

对于Javascript,你可以在代码栏之后同时使用jsjavascript,因为它们是 Rouge 中默认的语言别名。因此,以下两个代码块是相同的:

使用语言别名 js:

```js
foo();
```

使用语言别名 javascript:

```javascript
foo();
```

最佳答案

我能够利用 Jekyll 的 _plugins 目录“扩展”Rogue 荧光笔。

我的大部分研究来自 rogue-rubyGitHub Issue #1392source code用于 LinkedIn 的 rest-li 基于 jekyll 的网站。

步骤

  1. 在你的 Jekyll 根目录中创建一个 _plugins 目录
  2. _plugins目录下创建一个ruby文件
  3. 使用以下代码继承现有的Rogue Javascript code并“扩展”(又名覆盖)别名列表。
# This "hook" is executed right before the site's pages are rendered
Jekyll::Hooks.register :site, :pre_render do |site|
puts "Adding more JavaScript Markdown aliases..."
require "rouge"

# This class defines the PDL lexer which is used to highlight "pdl" code snippets during render-time
class MoreJSLexer < Rouge::Lexers::Javascript
title 'MoreJS'
aliases 'js', 'nodejs-repl'
end
end
  1. 运行 jekyll serve 并记下自定义日志行 “Adding more JavaScript Markdown aliases...”
 Incremental build: disabled. Enable with --incremental
Generating...
Jekyll Feed: Generating feed for posts
Adding more JavaScript Markdown aliases...
done in 0.637 seconds.
Auto-regeneration: enabled for '/Users/kueng/work/sandboxes/minima'
Server address: http://127.0.0.1:4000
Server running... press ctrl-c to stop.

测试

我使用了 minima GitHub 存储库作为我的沙箱和 jekyll 3.8.7。我使用步骤 3 中的代码创建了一个 _plugins/more_javascript.rb Ruby 文件。我使用下面的 markdown 片段编辑了一个 markdown 文件,只注意到 jsnodejs-repl 有语法高亮。

```nodejs
var a, b, c;
a = 5; b = 6; c = a + b;
document.getElementById("demo1").innerHTML = c;
```
```js
var a, b, c;
a = 5; b = 6; c = a + b;
document.getElementById("demo1").innerHTML = c;
```
```nodejs-repl
var a, b, c;
a = 5; b = 6; c = a + b;
document.getElementById("demo1").innerHTML = c;
```

关于javascript - 如何在 Jekyll 3 中为 rouge 指定自定义语言解析器别名?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61814907/

31 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com