Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: <img> & <video> doesn't work with assets in relative paths #358

Open
ABausG opened this issue Aug 28, 2024 · 5 comments
Open

bug: <img> & <video> doesn't work with assets in relative paths #358

ABausG opened this issue Aug 28, 2024 · 5 comments
Labels
bug Something isn't working

Comments

@ABausG
Copy link

ABausG commented Aug 28, 2024

See title.

I was using <img src="/assets/image.png"/> which didn't work.

Upon reading the documentation really carefully I noticed that it only mentioned the <Image> tag and changing it to that worked.

Is there a particular reason why the Mapping of <img> is not working?

Going forward I think there could be two ways:

  1. is supported with relative paths
  2. A callout is added to the docs hinting that it has to be <Image> and not <img>. Happy to add that respective callout to the docs if desired :)
@Ehesp
Copy link
Member

Ehesp commented Aug 28, 2024

Hey, they should be using the same underlying component, see: https://github.com/invertase/docs.page/blob/main/website/src/components/Markdown.tsx#L43

There's a big update landing tomorrow so I'll double check whether this is still relevant when that lands 👍

@ABausG
Copy link
Author

ABausG commented Aug 28, 2024

Let's say I am planning on doing an initial release of my docs in let's say the next 30 minutes :D Is there something I had to change right away? :D

@Salakar
Copy link
Member

Salakar commented Sep 7, 2024

Seems like this is still an issue at least for video components, a reproduction visible on this page: https://docs.page/donnc/jawce/demo

@Salakar Salakar added the bug Something isn't working label Sep 7, 2024
@Salakar Salakar changed the title <img> doesn't work with assets in relative paths bug: <img> & <video> doesn't work with assets in relative paths Sep 7, 2024
@Ehesp
Copy link
Member

Ehesp commented Sep 9, 2024

Hey @ABausG

My understanding of MDX is that this is intended behaviour - MDX is treating video and img as literals which don't get parsed, see the docs: https://mdxjs.com/docs/using-mdx/#components

TLDR:

image
image

The <Video /> and <Image /> components should be used here which pass on the component props of the HTML elements. Is this something you're able to do?

@ABausG
Copy link
Author

ABausG commented Sep 9, 2024

Yes! Was able to use the full tag.

Notbsure if it might be worth to add a small disclaimer to the docs to indicate that. I had to read the page a couple of times until I noticed it was always talking about Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants