gatsby-source-sanity

[olavea]

• npm i gatsby-source-sanity

• + gatsby-source-sanity@7.4.1

• npm install gatsby@latest gatsby-plugin-image@latest gatsby-plugin-sharp@latest gatsby-transformer-sharp@latest

• gatsbyImage

// templates / RecipeSong.js
import { graphql } from "gatsby";
import React from "react";
import { GatsbyImage } from "gatsby-plugin-image";

export default function SingleImagePage({ data }) {
  return (
    <>
      <div>
        <h2 className="mark"> {data.supplies.name}</h2>
        <GatsbyImage
          image={data.supplies.image.asset.gatsbyImage}
          alt={data.supplies.name}
        />
      </div>
    </>
  );
}

export const query = graphql`
  query MySQLQuery($catsby: String!) {
    supplies: sanityPizza(id: { eq: $catsby }) {
      id
      name
      image {
        asset {
          gatsbyImage(width: 1333, placeholder: BLURRED, formats: AUTO)
        }
      }
    }
  }
`;

success Building development bundle - 12.925s
success Writing page-data.json files to public directory - 0.252s - 0/52 206.74/s

30 minutes total work time

http://localhost:8000/_gatsby/image/aHR0cHM6Ly9jZG4uc2FuaXR5LmlvL2ltYWdlcy84Zzh3bG82Ny9wcm9kdWN0aW9uLzgzODg0MjNlNGI5YTc5OTFhMThhOTUxNzQzMWJiZDU4NTljZTVlZmMtMjAwMHgyNjY3LmpwZw==/dz0xMzMzJmg9MTc3OCZmbT1qcGcmcT03NQ==/Lego-tivoli-2.jpg

• is that link proof of image CDN?

[olavea]

round 2
success Building development bundle - 45.984s
success Writing page-data.json files to public directory - 0.316s - 3/68 214.96/s

round 3
success Building development bundle - 9.821s
success Writing page-data.json files to public directory - 0.215s - 3/68 316.31/s

clean 4
success Building development bundle - 34.069s
success Writing page-data.json files to public directory - 0.215s - 3/81 376.18/s