Hexo 使用 MD 语法显示图片

之前我用过一些免费的图床，比如微博图床，然而后面有一些图片链接失效了。所以在没有长久有效的图床时，把图片放在本地的资源文件夹里不失为一种方法。

开启资源文件夹

修改 _config.yml 文件
post_asset_folder: true

这样在创建新文章的时候，同时也会创建一个与文字同名的文件夹。可以把一些资源文件放在这个文件夹里面，然后用相对路径来引用。

但是 hexo 的图片标签很奇怪{% asset_img slug [title] %} 远不如 md 标签 ![]() 简洁。

幸好，hexo 目前也支持了 md 图片标签，只是需要安装 hexo-renderer-marked 。

参考：hexo资源文件夹

安装 hexo-renderer-marked

注意： 如果 hexo 的版本比较低的话，即便是安装了 hexo-renderer-marked 可能会出现虽然使用了 md 图片标签，但是图片仍然不显示的问题。

1. 进入站点文件夹查看 hexo 版本 hexo -v, 如果是4.x 版本，还是升级到最新版比较好。

2. 查看 nodejs 的版本 node -v
nodejs 的版本限制可以在hexo 的文档中查看 Node.js 版本限制

3. 通过 npm 升级 hexo

npm install -g npm-check     //安装npm-check    
npm-check                    //查看系统插件是否需要升级
npm install -g npm-upgrade   //安装npm-upgrade
npm-upgrade        //更新package.json
//在执行npm-upgrade命令后会要求输入yes或者no，直接输入Yes或Y即可
npm update -g      //更新全局插件
npm update --save  //更新系统插件

参考：Hexo更新到5.2.0版本

4. 安装 hexo-renderer-marked

安装完毕后

用hexo 写文章时的层级目录

–文章.md
–文章同名文件夹
｜– image.格式

这样就可以使用 ![](image.格式) 来展示图片了。

至于本地的 md 编辑器，比如我用的是 MacDown 编辑器，则可以使用 ![](文章同名文件夹/image.格式) 来预览,发布时则可以隐藏掉， <!-- ![](文章同名文件夹/image.格式) --> 。