Gatsby

npm install cortado-js

// Import optimizeImage and resizeImage functions from Cortado.js
import { optimizeImage, resizeImage } from 'cortado-js';

export const query = graphql`
  query {
    file(relativePath: { eq: "image.jpg" }) {
      publicURL
    }
  }
`;

const MyComponent = ({ data }) => {
  // Call optimizeImage with the path to your image
  const optimizedImage = optimizeImage(data.file.publicURL);
  
  // Call resizeImage to resize the image to a specific width and height
  const resizedImage = resizeImage(data.file.publicURL, { width: 300, height: 200 });
  
  return (
    <div>
      {/* Use the optimized image source in your component */}
      <img src={optimizedImage} alt="Optimized Image" />
      
      {/* Use the resized image source in your component */}
      <img src={resizedImage} alt="Resized Image" />
    </div>
  );
};

export default MyComponent;