2016 年在 GitHub wiki 中嵌入 SVG 图像

Question

是的，有 questions about this。不幸的是，关于过去五年左右不同工作方式的不同事物的信息，现在的答案都是混乱的。

所以我到底要怎么做

嵌入
一张 svg 图片
在 GitHub.wiki 文件夹中
在 GitHub.wiki 页面中

我不敢相信你需要博士学位。

这是我的嵌入损坏的示例页面： - https://github.com/Sciss/ScalaCollider/wiki/Architecture/2413e094a59df4705e770b2a57ff84a8f0a1e7b4

这是实际情况： - https://raw.githubusercontent.com/wiki/Sciss/ScalaCollider/images/ScalaCollider_types.svg

我想问题是它呈现为原始文本而不是显示为 svg 图像？

不，我不想设置 gh-pages。我想使用该死的 Wiki，因为那是它应该做的。

Answer 1

好的，显然是这样的：

GitHub 不想从原始 github 内容正确渲染图像。
所以忘记将它们嵌入 wiki
为主项目创建一个 gh-pages 分支，除非你已经有了一个
在该分支中找到或创建一个未使用的目录，并将图像添加到那里
Link 到 gh-pages URL

例如https://sciss.github.io/ScalaCollider/images/ScalaCollider_types.svg

不酷，但很管用。

Answer 2

您可以使用 jsdelivr.net 来做到这一点。

步骤：

将文件https://raw.githubusercontent.com/wiki/Sciss/ScalaCollider/images/ScalaCollider_types.svg上传到任意存储库下的一个文件夹。
在 GitHub 上找到 svg link，然后单击 "Raw" 版本。
复制URL.
将raw.githubusercontent.com更改为cdn.jsdelivr.net
在您的用户名前插入 /gh/。
删除 branch 名称。
（可选）插入您想要 link 的版本，作为 @version（如果不这样做，您将获得 latest - 这可能会导致长期缓存)
使用标签image，然后将?sanitize=true添加到svg文件的路径尾部。

例如，

如果 github 中的原始 svg 文件路径是：

https://raw.githubusercontent.com/yanglr/Beautify-cnblogs/master/images/github-pendant-rightCorner.svg

您可以使用以下：

<a href="https://github.com/yanglr">
<img style="position: absolute; top: 76px; right: 0; border: 0" alt="Fork me on GitHub" 
src="https://cdn.jsdelivr.net/gh/yanglr/Beautify-cnblogs/images/github-pendant-rightCorner.svg?sanitize=true"></a>

结果：

参考：

Link and execute external JavaScript file hosted on GitHub

2016 年在 GitHub wiki 中嵌入 SVG 图像

Embed SVG image in GitHub wiki in 2016

svg

github

wiki