Hexo中添加本地图片

  • 安装插件:

    1
    2
    // hexo 目录下执行
    $ npm install hexo-asset-image --save
  • 主页配置文件_config.yml 里的post_asset_folder:这个选项设置为true;

  • 使用 hexo n 命令去新建文章;运行hexo n “xxxx”来生成md博文时,/source/_posts文件夹内除了xxxx.md文件还有一个同名的文件夹;

  • 最后在xxxx.md中想引入图片时,先把图片复制到xxxx这个文件夹中,然后只需要在xxxx.md中按照markdown的格式引入图片:![你想输入的替代文字](xxxx/图片名.jpg);注意:xxxx是这个md文件的名字,也是同名文件夹的名字。只需要有文件夹名字即可,不需要有什么绝对路径。你想引入的图片就只需要放入xxxx这个文件夹内就好了,很像引用相对路径。

  • 最后检查一下,hexo g 生成页面后,进入 public\2017\02\26\index.html 文件中查看相关字段,可以发现,html标签内的语句是 <img src="2017/02/26/xxxx/图片名.jpg">,而不是<img src="xxxx/图片名.jpg>。这很重要,关乎你的网页是否可以真正加载你想插入的图片