You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何将包含PlantUML图的AsciiDoc发布到GitHub Wiki?

解决GitHub中Asciidoc无法渲染PlantUML图的方法

GitHub的Asciidoc解析器不支持asciidoctor-diagram插件,无法直接渲染PlantUML代码块,需要提前将PlantUML预渲染为图片,再修改Asciidoc文件引用这些图片,具体步骤如下:

1. 预生成PlantUML图片

使用asciidoctor-diagram插件从原Asciidoc文件中提取PlantUML代码并生成图片:

# 生成PlantUML图片到指定的images目录
asciidoctor -r asciidoctor-diagram -a plantuml-output-dir=images root.adoc

执行后,会在images目录下生成对应PlantUML代码块的图片(示例中为plant.png)。

2. 修改原Asciidoc文件

将原文件中的PlantUML代码块替换为普通图片引用:
修改前:

[plantuml,plant,png]
....
usecase plant
....

修改后:

image::plant.png[]

保留原文件中的:imagesdir: images配置,确保图片路径正确。

3. 提交文件到GitHub

将修改后的root.adoc、原有的onion.png和生成的plant.png(均放在images目录下)一起提交到GitHub,此时GitHub的Asciidoc渲染器就能正常显示所有图片。

可选:用GitHub Actions自动处理

如果需要每次提交代码时自动生成PlantUML图片,可以添加GitHub Actions工作流:

  1. 在仓库中创建.github/workflows/plantuml-render.yml文件
  2. 写入以下内容:
name: Render PlantUML
on: [push]
jobs:
  render:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Install dependencies
        run: sudo apt-get install -y asciidoctor plantuml
      - name: Generate PlantUML images
        run: asciidoctor -r asciidoctor-diagram -a plantuml-output-dir=images root.adoc
      - name: Commit generated images
        run: |
          git config --global user.name "GitHub Actions"
          git config --global user.email "actions@github.com"
          git add images/plant.png
          git commit -m "Auto-generate PlantUML image" || echo "No changes to commit"
          git push

这样每次提交代码时,Actions会自动生成PlantUML图片并提交到仓库,无需手动处理。

内容的提问来源于stack exchange,提问作者fan

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.03 13:41:10