gatsby-plugin-sharp | Support withoutEnlargement

Summary

The Sharp resize() function has a useful option: withoutEnlargement that can be used to prevent source images from being enlarged beyond their original size, which helps prevent undesirable degradation in image quality. It would be nice if Gatsby Plugin Sharp exposed this option as a Shared Option.

Basic example

childImageSharp{
    fixed(
        width: 1000
        height: 600
        withoutEnlargement: true
    ){
        ...GatsbyImageSharpFixed
    }
}

childImageSharp{
    fluid(
        maxWidth: 1000
        maxHeight: 600
        withoutEnlargement: true
    ){
        ...GatsbyImageSharpFluid
    }
}

childImageSharp{
    resize(
        width: 1000
        height: 600
        withoutEnlargement: true
    ){
        ...GatsbyImageSharpResize
    }
}

Motivation

There are use cases where it is desirable to limit the resizing of an image to sizes that are <= its original size, in order to prevent loss in image quality. The withoutEnlargement option allows you to enforce this restriction. It would be great if Gatsby’s Sharp plugin exposed this functionality.

[ascorbic]

It’s still in beta, but should be stable next month

[marcotisi]

Thank you, I’ll take a look at the new resolver