Markdown写文档最不方便的地方在于无法将图片嵌入到文档中。解决这个痛点通常的做法是将图片先上传到图床,然后引用url。我早期的博文就是这么做的。

这方法自然蛋疼的紧,一方面需要耗费更多是时间来设置图床,上床图片;另一方面,图片与文档分开保存既不利于组织和归档,也容易出现资源丢失的问题。

在使用git保存文档的时候意识到,将图片保存到相对路径是个较好的解决方式。通常是一篇文档创建一个目录,在目录下为图片再创建一个目录images,md文件存在与images同级的根目录下,引用图片用./images/1.png这种格式。

hexo也提供了类似的方法保存图片,他们叫做asset folders

asset folders有两种,一种是全局的,默认开启。使用的方法是:

  • 在source目录下创建目录images,将图片放入其中
  • 在博文内容中,通过![][/images/1.png]引用

这里的source目录是指在根目录下,存放_post目录的目录,不是主题下的source目录

另一种是在source/_post下单独篇博文创建资源目录,这个目录与博文标题同名。这个配置默认不开启,需要额外配置。具体方法是:在配置文档_config.yml里找到(找不到就添加)post_asset_folder字段,改为true

然后新建博文(通过hexo new指令)时,会自动在博文同级目录下创建资源目录,将图片移入即可。

引用的方式与全局的方式略有不同,需要用到模版语言。在hexo3之后的版本,模板语言解析已经打包进hexo中了,无需另外配置。如果版本低,请自行搜索引用方法。引用方式即为在引用处写

{% asset_img IMAGE_NAME IMAGE_DESC %}

IMAGE_NAME 即为图片名称,名称后接描述。hexo在generate的时候会自动替换成对应的url 如果名称和描述中有空格,将其用双引号括起来即可。