add resolveAssetUrl to FigureWithOptionalCaption

[Delta-in-hub]

npx slidev build --base "/slide/"

In this case,academic theme figure's path is not been resolved correctly.

Using resolveAssetUrl to fix that.

[alexanderdavide]

Hey, thanks for opening this PR!

Can you please share the structure of your project to understand your use case?

[Delta-in-hub]

For example,If i want to deploy the slide to github pages and I want to put it in the subfolder of repo.

The default imge path is like "/image.png", while in github page it's "xxx.github.io/image.png". BUT the correct one is "xxx.github.io/subfolder/image.png".

Thus we need to use --base "/subfolder/" argument when build.

However,this academic theme's layout have bug in this situation, the figure image path is still "/image.png" rather than " /subfolder/image.png".

---

Reproduce bug quickly.

# Any slide.md with this academic theme and using Layouts  like figure or figure-side.
npx slidev build --base "/dist/"

python -m http.server -d ./

# open http://localhost:8000/dist/ in browser

You will see that the image not shown as expected.

---

npx slidev build
python -m http.server -d ./dist

# open http://localhost:8000/ in browser

Everything works fine.

[alexanderdavide]

Thanks for your explanations. I currently can't reproduce this bug using @slidev/cli v0.38.0. The image is resolved correctly.

• Again, how does your project structure look like?
• Which version of @slidev/cli do you use?

If you can create a repository with your reproduction, this would help.

[alexanderdavide]

I've now been able to reproduce the bug linking an image with figureUrl: /image.png instead of figureUrl: image.png. The former resolves the image from the root which breaks in this case while the latter works because it's resolved relatively.

Slidev, by linking to Vite's public directory, advises to reference images from root, so this should definitely work seamlessly here too.

Using resolveAssetUrl is a wonderful solution as it considers the base. Slidev makes use of it in its default layouts such as image. I've just copied over the layout-helper for styling the cover layout not knowing about the problem of resolving images when users set a different base.