Open WilfSilver opened 3 months ago
After further investigation, the issue seems to be that the images are actually displaying in astro dev
.
I should be using the import.meta.env.ASSETS_PREFIX
or via the path
option in the typescript config explained here
Therefore, the expected result should be that astro dev
does not display the images/prints out an error saying the images can't be found.
This is because Vite serves the filesystem in dev, nothing to do with assets or images in particular. I've always found this quite weird personally, but I assume that Vite uses this for specific reasons
Vite supports root-relative paths as it's advertised as a glorified filesystem server that serves files from your project root. There's a few explorations in the past to make this more strict, e.g. only allowing behind /@something/src/assets/...
only, but that will be a really big breaking change.
I think we can support this in Astro if we want to since we call this.resolve
here:
And it can resolve root-relative paths and public paths, and do some additional checks there. But I'm also fine if we want a blanket "starts with / is never handled": https://github.com/withastro/astro/blob/f226cb65d166779a154fca07904a1cab662f6ac8/packages/markdown/remark/src/remark-collect-images.ts#L28-L31
I don't think we should try and support this, otherwise people will expect it in other places as well.
Yeah, I agree with Matthew here. I would keep the behaviour as simple as possible and clarify the user expectations.
After discussing this we think this might be reasonable to support and not be too difficult to implement.
in the meantime is there any way to have the images display normally on the build?
@bluwy those didn't work, relative paths get passed as a string of text for some reason when used in .md and importing through assets directly doesn't work for build.
So this is how i kinda fixed this, i had to add those images on public/images, have to update astro(if not running latest) and then import them.
@bluwy those didn't work, relative paths get passed as a string of text for some reason when used in .md and importing through assets directly doesn't work for build.
Could you share the code for this? Relative links and aliases were working in my original project (and the example code - relative links are used as an example of how it should be working)
Astro Info
If this issue only occurs in one browser, which browser is a problem?
All
Describe the Bug
I have an
md
file referencing an image/gif:If I run
astro dev
, it displays the image fine, however runningastro build
, the image does not show on the website (in place it just has the alt text)From looking at the files, it does not transfer/build the images into the
dist
directory.If I change the link to a relative one e.g.
../../assets/image.gif
it works absolutely fineWhat's the expected result?
Consistency between
astro dev
andastro build
when using/src/assets
.EDIT: please see comment below, but in summary, the image should not be displayed in both instances
Link to Minimal Reproducible Example
https://github.com/WilfSilver/astro-asset-link-issue
Participation