module.exports={plugins:[{resolve:`gatsby-plugin-sharp`,options:{defaults:{formats:[`auto`,`webp`],placeholder:`dominantColor`,quality:50,breakpoints:[750,1080,1366,1920],backgroundColor:`transparent`,tracedSVGOptions:{},blurredOptions:{},jpgOptions:{},pngOptions:{},webpOptions:{},avifOptions...
Using CSS to display background images has more limited support for responsive image handling than the<picture>element. Most importantly, it does not handle fallback for next-gen image formats such as AVIF and WebP. You can get the benefits ofgatsby-plugin-imagefor background images without any...
It registers the resolver with all of the base arguments needed to create the image data, such as width, aspect ratio, layout and background color. These are defined with comprehensive descriptions that are visible when your users are building queries in GraphiQL. You can pass additional ...
You can use the background color option to set a static background if you wish. formats Default component prop value: ["auto", "webp"]. Default resolver prop value: [AUTO, WEBP] The Gatsby Image plugin supports four output formats: JPEG, PNG, WebP and AVIF. By default, the plugin ...