你想实现本地Typora进行写作,然后丝滑的推倒你的blog网站吗?本篇blog可以帮你实现这一效果。

为什么会需要解决这个问题?

通常我们建立一个个人博客网站之后,尤其是如果你是基于Hexo建站的话,你的post全部都是基于md文件的。那么如果正好,你已经习惯了用md文件进行本地写作,那么你一定想要快速的直接把本地的md文件deploy到你的网站上。

如果你没有使用过图床,或者你专门想要把你每个md文件插入的图片放到一个专门的位置。比如说我,我就是用Typora的高级功能,指定了存图片的地点,这样你的图片即在本地,又分门别类,十分好找。

现在你再deply到你的blog网站上时,你就会遇到问题了,因为Hexo generate出来的public文件夹里的各个post文件夹里并没有相应的图片。本篇就旨在让你丝滑的将本地文件deply到你的个人blog网站。

Hexo Settings

想要实现以上的功能,首先对于每一个post,你需要有一个文件夹来存你这post里面的图片。

你需要将 post_asset_folder: false 改成 post_asset_folder: true 来对每一个post都创建一个文件夹来存这个post里面的图片。

效果如下:

使用hexo new post "Hello World" 创建一个新post。

CleanShot 2025-03-25 at 20.01.11

在你的 source/_post 文件夹里,你应该可以看到一个Hello-World 文件夹和一个 Hello-World.md 文件。

CleanShot 2025-03-25 at 20.02.41

但是如果你直接 hexo generate 的话,你会在public文件夹,得到一个post文件夹,里面有你的md文件和相应的图片。

比如在这里,我有 Typora+Hexo工作流.md文件和一个相对应的 Typora+Hexo工作流

CleanShot 2025-03-25 at 20.08.30

但是当我 hexo generate 之后,我会只得到一个文件夹。

CleanShot 2025-03-25 at 20.10.26

这就会使得之前的md文件里的图片路径有问题。

我的解决办法就是把这些图片再塞到一个同名文件夹里,相应的代码在这里。将organize_images.py 放在你的Hexo项目根目录下,执行 python organize_images.py 效果如下:

CleanShot 2025-03-25 at 20.13.14

这样你的md文件里的图片路径就没有问题啦。

需要注意的是,我使用的theme是Bytterfly,我不确定是不是所有的theme创建的public文件都是根据日期去创建post文件的,如果不是的话,我的这个文件可能不会work。但是这是一个非常简单的文件,你可以自行更改。

Typora Setting

如果你是比较会用typora,知道怎么样子才能设置自动保存图片。那你就可以略过这个section,如果你还不太知道,可以继续看。

非常简单,打开你的Typora,进入Format > Image > Global Image Settings。设置成图片里的样子就可以啦!

CleanShot 2025-03-25 at 20.18.30
  1. 这个的意思就是同路径下,如果没有的话创建一个跟你md文件同名的folder去存你的图片,如果有的话直接存到这个同名的folder里。这个是专门和Hexo的相匹配上的。
  2. 这个意思是使用相对路径,必须要使用相对路径。
  3. 这个可以加,可以不加,我个人习惯加。但其实如果你deploy到GitHub或者别的网站上的话其实正常应该不叫。但反正加了也能work。

如果你的不是mac或者你是中文,或者版本不一样,你可以自行搜索一下如何进行修改。

其实我当时随便搜了一下,就搜到了两三个Hexo来解决这个问题,但是他们都有bug而且没有解决,而且感觉也不会解决了(非常老的repo)。这个问题我感觉也不需要插件这么麻烦,就一个非常简答的脚本就可以解决。

大概就是这样啦,希望能对你有用,如果你有什么问题,可以发到评论区里。