ImageCard是否可以使用相对路径引用图片？

[OOAAHH]

就像是下面的两种用法
markdown原生支持如下的写法

![图片](./scfig1_gif.gif)

ImageCard是否也可以使用相对路径或者类似的方法来引用图片？我也有尝试让image="public资源"，但是效果也不如人意。

<ImageCard
  image="./scfig1_gif.gif"
  title="注意右上角的绿色按钮"
  description="注意右上角的绿色按钮，点击即可开始分析，并在3秒后自动跳转到分析历史界面。"
  href="/"
  author="Hughes"
  date="2024/10/30"
/>

[pengzhanbo]

不支持直接使用相对路径，因为这个 image 属性值并没有经过 构建工具进行处理。想要使用相对路径，需要在 markdown 中添加 script setup，在其中导入图片，然后将值赋值给 image 。

<script setup>
import imgUrl from './xxx.png'
</script>

<ImageCard :image="imgUrl" />

另外，使用 绝对路径的图片地址， / 是相对于 .vuepress/public 目录的，因此，/public/images/xxx.png 在 Markdown 中的使用为 <ImageCard image="/images/xxx.png" />

[OOAAHH]

感谢您的回答，事实上我尝试过使用绝对路径。我的代码如下所示，这个代码不能正常的使imagecard显示在网页中。

<ImageCard
  image="/images/WDLinput.gif"
  title=""
  description=""
  href="/"
  author="Hughes"
  date="2024/10/30"
/>

我的文件结构是

├── public
│   ├── images
│   │   ├── WDLinput.gif
│   │   ├── logo.png
│   │   ├── scfig1_gif.gif
│   │   ├── scfig2_gif.gif
│   │   ├── scfig3_gif.gif
│   │   └── scfig4_gif.gif
│   └── plume.svg

这里很奇怪的一点是，我能够在config.ts中通过/images/logo.png来替换logo.

而当我尝试../images/scfig1_gif.gif，因为我的markdown文件在notes下，imagecard可以正常显示。

[pengzhanbo]

我实测 绝对路径是没有问题的，你需要检查下是否是路径的大小写问题。