Thumbor TS Gatsby Image

Auto convert thumbor-ts instances into gatsby-image compatible objects

Usage

1import React, { FC } from "react";
2import Img from "gatsby-image";
3import { useFixed } from "thumbor-ts-gatsby-image";
4import { Thumbor } from "thumbor-ts";
5
6// Your encryption key is not required, but your link will be unsafe.
7const thumbor = Thumbor({
8  serverUrl: "http://myserver.thumbor.com",
9  securityKey: "MY_KEY"
10});
11
12const image = thumbor.setImagePath("00223lsvrnzeaf42.png").smartCrop(true);
13
14const Img: FC = () => {
15  const fixed = useFixed(image, { width: 200, height: 300 });
16  return <Img fixed={fixed} />;
17};