Hugo处理的Markdown页面同目录图片无法显示问题求助
问题核心原因
Hugo的静态资源寻址逻辑和普通原生Markdown不同,默认不支持非页面捆绑目录下的Markdown文件同目录相对路径引用图片,你测试的写法里部分将路径用引号包裹在括号内的写法也不符合标准Markdown语法,会直接导致路径解析失败。
解决步骤
- 调整文件目录为页面捆绑结构
新建一个和当前Markdown页面访问路径同名的文件夹,将原Markdown文件重命名为index.md放入该文件夹,再把需要引用的图片也放入同一文件夹,最终结构示例:content/ └── 你的内容分类目录(比如post、docs) └── 你的页面目录(比如app-list) ├── index.md (原你的Markdown文件) └── application_list_complete.png - 使用正确的引用写法
二选一即可,不要给路径加多余的引号:- 标准Markdown写法
- Hugo原生短代码写法(兼容性更强,支持自动图片裁剪、格式优化)
{{< figure src="application_list_complete.png" alt="aaa" title="可选标题" >}}
额外排查项
- 确认Hugo配置文件中的
baseURL参数填写正确,相对路径的解析依赖该参数的正确配置 - 确认图片文件名大小写完全匹配,Hugo在类Unix系统下对文件名大小写敏感
- 清理Hugo缓存后重新生成站点,避免旧缓存导致资源不加载
内容的提问来源于stack exchange,提问作者Francis
相关产品推荐
相关产品推荐

