Pandoc:语法高亮代码的 CSS 文件在哪里?
Pandoc: where are CSS files for syntax highlighting code?
我有一个 Markdown 文件,例如
---
title: Question
date: 2020-07-07
---
This is some code:
```python
def add(a, b):
return a+b
```
并且我想利用 Pandoc 的语法突出显示。这很好用:
pandoc -s --to=html5 2020-07-07-question.md
因为它包含了必要的CSS,例如:
<style>
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
span.underline{text-decoration: underline;}
div.column{display: inline-block; vertical-align: top; width: 50%;}
div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
ul.task-list{list-style: none;}
...
然而,我实际上是在使用 Pypandoc 将 Markdown 编译成 HTML,然后我将 HTML 包含到网页中。因此,我希望 CSS 是独立的,我可以在文件中引用它,例如
<link rel='stylesheet' href='/path/to/some/highlighting.css'/>
我该怎么做?
可以通过 运行
检查用于 HTML 生成的默认模板
pandoc --print-default-template=html5
结果将取决于您的版本,但应该包含所有有趣的内容。例如,对于 pandoc 2.10,这将包括代码
<style>
$styles.html()$
</style>
这导致 pandoc 包含一个文件 styles.html
,其内容可通过
检索
pandoc --print-default-data-file=templates/styles.html
原则上,这就是您要找的。现在,您会注意到有很多模板命令,语法高亮 CSS 似乎不包括在内。这是因为 pandoc 会即时生成 CSS:样式的存储方式使得它们也很容易与其他输出一起使用。签出 --list-highlight-styles
和 --print-highlight-style
.
这对您来说意味着您可以只生成 HTML 输出并从那里复制粘贴代码。或者您可以创建一个仅包含
的辅助模板
$-- this is file highlighting-css.template
$highlighting-css$
然后使用该模板创建您的 highlighting.css
:
pandoc --template=highlighting-css.template sample.md -o highlighting.css
注意sample.md
必须包含高亮代码块如
~~~html
<p>placeholder</p>
~~~
这是必要的,因为 pandoc 仅在有要突出显示的内容时才会生成突出显示 CSS。
这是一个小 shell 脚本,它执行 @tarleb 在他的回答中描述的内容并自行清理:
#!/bin/sh
style=${1:-pygments}
tmp=
trap 'rm -f "$tmp"' EXIT
tmp=$(mktemp)
echo '$highlighting-css$' > "$tmp"
echo '`test`{.c}' | pandoc --highlight-style=$style --template=$tmp
我有一个 Markdown 文件,例如
---
title: Question
date: 2020-07-07
---
This is some code:
```python
def add(a, b):
return a+b
```
并且我想利用 Pandoc 的语法突出显示。这很好用:
pandoc -s --to=html5 2020-07-07-question.md
因为它包含了必要的CSS,例如:
<style>
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
span.underline{text-decoration: underline;}
div.column{display: inline-block; vertical-align: top; width: 50%;}
div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
ul.task-list{list-style: none;}
...
然而,我实际上是在使用 Pypandoc 将 Markdown 编译成 HTML,然后我将 HTML 包含到网页中。因此,我希望 CSS 是独立的,我可以在文件中引用它,例如
<link rel='stylesheet' href='/path/to/some/highlighting.css'/>
我该怎么做?
可以通过 运行
检查用于 HTML 生成的默认模板pandoc --print-default-template=html5
结果将取决于您的版本,但应该包含所有有趣的内容。例如,对于 pandoc 2.10,这将包括代码
<style>
$styles.html()$
</style>
这导致 pandoc 包含一个文件 styles.html
,其内容可通过
pandoc --print-default-data-file=templates/styles.html
原则上,这就是您要找的。现在,您会注意到有很多模板命令,语法高亮 CSS 似乎不包括在内。这是因为 pandoc 会即时生成 CSS:样式的存储方式使得它们也很容易与其他输出一起使用。签出 --list-highlight-styles
和 --print-highlight-style
.
这对您来说意味着您可以只生成 HTML 输出并从那里复制粘贴代码。或者您可以创建一个仅包含
的辅助模板$-- this is file highlighting-css.template
$highlighting-css$
然后使用该模板创建您的 highlighting.css
:
pandoc --template=highlighting-css.template sample.md -o highlighting.css
注意sample.md
必须包含高亮代码块如
~~~html
<p>placeholder</p>
~~~
这是必要的,因为 pandoc 仅在有要突出显示的内容时才会生成突出显示 CSS。
这是一个小 shell 脚本,它执行 @tarleb 在他的回答中描述的内容并自行清理:
#!/bin/sh
style=${1:-pygments}
tmp=
trap 'rm -f "$tmp"' EXIT
tmp=$(mktemp)
echo '$highlighting-css$' > "$tmp"
echo '`test`{.c}' | pandoc --highlight-style=$style --template=$tmp