🐛 BUG: RC - Cannot use <img /> when using @astrojs/image

[marcosmartini]

What version of astro are you using?

1.0.0-rc.1

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

npm

What operating system are you using?

Mac

Describe the Bug

If you have a project with normal <img/> or <picture/> elements, after installing and using <Image> or <Picture> from @astrojs/image the other "normal" images break. Their source attribute renders as an Object.

Basically, at the moment if we use @astrojs/image we can only use images through the integration, pure html <image> and <picture> stop working.

Thanks

Link to Minimal Reproducible Example

https://docs.astro.build/en/guides/integrations-guide/image/

Participation

• [ ] I am willing to submit a pull request for this issue.

[natemoo-re]

Pinging @tony-sull for more insight on this

[tony-sull]

@marcosmartini can you provide a code sample of one of the <img> or <picture> elements that broke after adding the image integration? Any chance they're using relative paths similar to <img src="./blog-image.jpg" />?

We're using plain old <img /> elements in a few places for the astro.build site along site <Image /> components

[marcosmartini]

@tony-sull

Here it is: https://github.com/marcosmartini/astro-img-test

I'm using local images.

Cheers, Marcos.

[marcosmartini]

Hey @tony-sull @natemoo-re

I just updated the issue to reflect that this also happens with the 1.0.0-rc.1 version of Astro and @astrojs/image 0.2.0. The following repo has been updated to reflect that:

https://github.com/marcosmartini/astro-img-test

Cheers, Marcos.

[marcosmartini]

According to the new docs, it appears that plain img tags won't work with files in the src directory if you're using @astrojs/image.