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页面。我想使用血腥的Wiki，因为这是它应该做的。

Answer 1

好的，显然这就是发生的事情：

• GitHub不希望从rawgithubcontent正确渲染图像。
• 所以不要忘记将它们嵌入到wiki中
• 为主项目创建一个gh-pages分支，除非您已经有一个分支
• 在该分支中查找或创建未使用的目录，并在其中添加图像
• 链接到gh页面的URL

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

不酷，但它的工作原理。

Answer 2

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

脚步：

1. 将文件https://raw.githubusercontent.com/wiki/Sciss/ScalaCollider/images/ScalaCollider_types.svg上传到任何存储库下的一个文件夹。
2. 在GitHub上找到svg链接，然后单击“Raw”版本。
3. 复制URL。
4. 将raw.githubusercontent.com改为cdn.jsdelivr.net
5. 在用户名前插入/gh/。
6. 删除branch名称。
7. （可选）插入要链接的版本，如@version（如果不这样做，您将获得最新版本 - 这可能会导致长期缓存）
8. 使用标签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