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

Include image filename with getGatsbyImageData #211

Open
owenhoskins opened this issue Jan 4, 2023 · 0 comments
Open

Include image filename with getGatsbyImageData #211

owenhoskins opened this issue Jan 4, 2023 · 0 comments

Comments

@owenhoskins
Copy link

owenhoskins commented Jan 4, 2023

Similar to #55 but specifically related to Using images outside of GraphQL. I am so far unable to pass the asset's filename into the getGatsbyImageData helper with gatsby-plugin-image and return a src/srcset containing the urls with the original filename.

I've tried the dl argument detailed here in the Sanity docs, but it seems the helper is ignoring that argument.

I've also poked around a bit in the underlying image utils helper generateImageData from gatsby-plugin-image but without luck. Hoping someone may have some insight on this?

As a last restore I am considering editing this object returned from the helper to append the filenames to each item in the srcSet.

<GatsbyImage image={getGatsbyImageData(value.image, { dl: value.image.asset?.filename, auto: 'format', hotspot: value.image.hotspot, placeholder: 'dominantColor' }, sanityConfig)} alt={value.image.asset?.altText || ''} />
{
    "images": {
        "sources": [],
        "fallback": {
            "src": "https://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?w=3024&h=4032&auto=format",
            "srcSet": "https://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?rect=1,0,3022,4032&w=320&h=427&auto=format 320w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?w=654&h=872&auto=format 654w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?w=768&h=1024&auto=format 768w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?rect=0,1,3024,4031&w=1024&h=1365&auto=format 1024w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?rect=0,1,3024,4031&w=1366&h=1821&auto=format 1366w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?rect=0,1,3024,4031&w=1600&h=2133&auto=format 1600w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?w=1920&h=2560&auto=format 1920w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?w=2048&h=2731&auto=format 2048w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?w=2560&h=3413&auto=format 2560w,\nhttps://cdn.sanity.io/images/j2khikyt/production/9b4fe26ba65cdc01a2c87be890d9cb979139f75d-3024x4032.jpg?w=3024&h=4032&auto=format 3024w",
            "sizes": "(min-width: 3024px) 3024px, 100vw"
        }
    },
    "layout": "constrained",
    "backgroundColor": "#c1bab3",
    "width": 3024,
    "height": 4032
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant