hexo图片无法加载的解决方案

prowk Lv1

前言

网上各类教程良莠不齐,大部分都是通过安装插件搞定的,本文不介绍相关原理,请放心食用。

解决方案

改_config.yml 文件

先将 _config.yml 文件中的 post_asset_folder 选项设为 true

1
post_asset_folder:true  

下载插件

在博客的文件夹下启动命令行,下载插件hexo-asset-img:

1
npm install hexo-asset-img --save

注意:是这个插件,不是hexo-asset-image

示例

新建一个博客文章(markdown文件),前面的该文件会使你在新建时同时新建一个同名的文件夹,这个文件夹用于放照片,在source/_posts目录下

1
hexo new secondblog

这时候把你的照片放进名叫secondblog的文件夹,打开你的secondblog.md,在你想放图片的地方按以下格式书写:

1
<img src="secondblog/image1.jpg">

image1.jpg是我例子图片的名称,secondblog也是我指定的名字,你可以自行替换。再在终端输入hexo clean,hexo g,hexo s三步,预览一下本地是否可以显示图片,没问题的话hexo d推送至github即可

补充说明

本人写作用的是vscode,如果冲突的话请自行更换教程。
本人无法确定下载插件那一步是否受到科学上网影响,不行的话自行下载插件然后放在node_moduels文件夹下即可
第一步更改文件配置一定要做,然后如果你想自己手动创建博客文档也行,自己创同名文件夹放图片效果是相同的。

放个图

  • Title: hexo图片无法加载的解决方案
  • Author: prowk
  • Created at : 2025-03-11 18:35:08
  • Updated at : 2025-03-11 19:38:01
  • Link: https://redefine.ohevan.com/2025/03/11/firstblog/
  • License: This work is licensed under CC BY-NC-SA 4.0.
Comments
On this page
hexo图片无法加载的解决方案