Hexo开启post_asset_folder后, 安装hexo-asset-image,不起作用的问题
使用 Hexo 和 github 搭建博客,真是挺有趣的事情,因为对于我们来说,随便敲几行代码,就可以拥有一个非常漂亮的博客。 但在写作的过程中,使用 Typora(一个 markdown 编辑器)插入图片的时候,非常不顺手。后来了解到用 hexo-asset-image 可以提升我的写作效率,,所以开始吧。
安装插件
在 nodejs 里边安装
npm install hexo-asset-image --save

把在 hexo 根目下的_config.yml 设置
post_asset_folder: true
新建文章
安装完了之后,新建一篇名为 test-img 的文章
hexo new [layout] test-img

现在可以看到 source/_posts 里边,除了有 test-img.md,还多一个文件夹 test-img

在里边我放一张名为 me.jpg 的图片, 插入图片的时候,输入

如图所示:

发现问题
当我回到 nodejs 的时候,发现不对劲~

然后,我去页面看,图片不显示, chrome-devtools 显示,找不到图片。

当我用 hexo g 生成文件的时候,发现报错, 如下:

FATAL something's wrong. May be you can find the solution here.....
Error: ENOENT: no such file or directory, open 'D:\nodejs6.5\hexo_blog\public\20
17-09-29-test-img.html\me.jpg'
仔细一看路径是
\public\2017-09-29-test-img.html\me.jpg
在 public 文件夹里边也找不到 2017-09-29-test-img.html 文件夹。

百思不得期解,我了解别人的博客都是的链接都是 域名/年份/月份/文件名 的路径, 比如:http://www.54tianzhisheng.cn/2017/09/23/Guava-limit/

而且我的路径是 /posts/how-to-use-wechat-debug.html, 所有的 html 都是放到

找到原因
为了满意的我好奇心~~,最终我找到了原因。原来,之前我把 hexo 根目下的_config.yml, 把 permalink 设置为 year-:month-:day-:title.html,hexo 就会在根目下生成 html, 而导致 生成 相关的文件夹失效。

是 permalink 和 post_asset_folder 这两个参数是相互影响的。
解决方案
把 hexo 根目下的_config.yml, 把 permalink 设置为 :year/:month/:day/:title/
permalink: :year/:month/:day/:title/
好,重新 hexo clean && hexo g , 得到的就是我们要的那种方路径,而且图片显示正常了。

温馨提示一下:
用 Typora 插入图片时 输入

的时候,虽然在图片网页上能够正常显示,但是在 Typora 编辑时无法显示,那如何才能让 Typora 正常显示呢? 这里分享一个小技巧:
在 Typora 中, 选择 Edit > Image Tools > Use Image Root Path, 然后选择你要的相关文件夹,选择之后,在 md 文件头上 会多一个 typora-root-url: xxxx, 好了,现在可以正常显示了。具体操作看下图。



最后,分享一下源代码: