其他 Markdown 技巧
# 110.其他 Markdown 技巧
讲讲其他关于 Markdown 的杂技。
# Slidev
官网:cn.sli.dev/guide (opens new window)
Slidev 是一款专门为开发者打造的演示文稿工具,目前在 Github 上已有 23K+Star
。
通过 Slidev,我们只要使用熟悉的 Markdown 就可以做出炫酷的 PPT 来,同时拥有支持 HTML 和 Vue 组件的能力,并且能够呈现像素级完美的布局。
# 去除冗余图片
写博客的时候,经常会插入图片。如果觉得图片不合适,可以直接在编辑器中删掉该图片的引用,但是这就有一个问题:图片所在的文件夹中,对应的图片并没有被删除。
如果你使用的是思源笔记,可以很方便地在设置里去除未引用的资源(包括图片):
而 Typora 也有相关的插件,参考 github.com/obgnail/typora_plugin (opens new window)
如果你使用的是其他 Markdown 编辑器,那么可能只能另辟蹊径了,我随手 Google 了下,也有不少人自己动手写代码完成(其实懂编程的话并不难,特别是用 Python 的话):
再不济,也能手工删除,就是费时费力了点。
# 将图片转为 Base64 文本
# 为什么要转
在 Markdown 中,插入图片的语法是:
。但这有个问题,就是图片得跟着文章走,对图片的依赖很重,例如想要发布到网上,就得先将图片上传到其他地方;而如果要发给朋友/同事,还需要连图片一起发送。
为此,我们可以改为使用内嵌图片,其原理就是将图片转为文本的形式,嵌入到文章内,这样就不用依赖其他文件了。
# 原理
那么如何将图片转为文本呢?我们可以使用 Base64 编码。
Base64 是一种常见的二进制数据编码方式,它将任意二进制数据转换为文本字符串,便于在网络传输、数据存储和HTML/CSS等文本环境中直接使用。此外,电子邮件协议就是文本协议,如果要在电子邮件中添加一个二进制文件(比如图片),就可以用 Base64 编码,然后以文本的形式传送。
如果想深入了解 Base64 编码,可以看我的另一篇文章:Base64编码 (opens new window)
举个例子,这是某张图片的超链接,圆括号里的内容就是将图片进行 Base 64 编码后的内容:

效果:
没错,一张小小的图片,转换成文本后几乎就能霸屏.... 所以我觉得这种方式不太优雅,为此我是坚持使用图床的。
此外,如果图片太多,那么整个文章就会变的很大,慎用!
# 如何转
可以用一些在线网站 (opens new window)来转(善用 Google):
也可以用第三方插件来转,例如 VSCode 有个插件叫 ClipImage64 的插件,就支持这个转换:
如果你懂编程,那么几乎任何编程语言都支持这个转换,例如 Python:
import base64
f=open('xxxxpath.jpg','rb')
ls_f=base64.b64encode(f.read())
f.close()
print(ls_f)
2
3
4
5
# 优化
图片的 base64
编码非常之长,直接插入文件中间会影响文章的美观。为此,我们可以使用变量的写法。
在需要插入图片的地方写: ![][reference_name]
在任何地方(最好是文章末尾)写: [reference_name]:<base64>
效果:
然后文章的末尾定义了该图片的 Base 64 编码:
如果你有什么其他“杂技”,也欢迎留言分享🙃
——(未完待续)——