prismicio / gatsby-source-prismic-graphql

Gatsby source plugin for Prismic GraphQL
MIT License
17 stars 14 forks source link

Image Sharp not working #3

Closed steoneill closed 4 years ago

steoneill commented 4 years ago

When querying an imageSharp field, i get this back:

Unexpected error value: "failed to process https://images.prismic.io/rmslocotec/ac94c66f-6ef2-4aa0-a3d7-d9fac5d2751f_rmslogo(3).jpg\nError: ENOENT: no such file or directory, open '/Users/ste/code/gatsby/rms/.cache/caches/@prismicio/gatsby-source-prismic-graphql/tmp-35ff2d2f997a518e1750797ef4bb48d7.jpg'"

   5 |   srcSet
   6 |   sizes
   7 | }
   8 |
   9 | query Logo {
  10 |   prismic {
  11 |     allSite_settingss {
  12 |       edges {
  13 |         node {
  14 |           logo
> 15 |           logoSharp {
     |           ^
  16 |             childImageSharp {
  17 |               fluid(maxWidth: 400, maxHeight: 250) {
  18 |                 ...GatsbyImageSharpFluid
  19 |               }
  20 |             }
  21 |           }
  22 |         }
  23 |       }
  24 |     }
  25 |   }
MarcMcIntosh commented 4 years ago

Yes, my understanding of this issue is that sharp/gatsby-image require the image to be on disk to do transformations. While images in prismic are handled through imgix, it should be able to pass those parameters to imgix but then sharp wouldn't be doing the transformations.

I think there was a similar issue with contentful. https://www.gatsbyjs.org/packages/gatsby-transformer-sharp/#how-to-use

Note: An exception to this is when using gatsby-source-contentful, as the source plugin and the assets are not downloaded to the local filesystem. By default, the gatsby-source-contentful plugin creates a ContentfulAsset node for every image with links to Contentful’s CDN, therefore it is not necessary to use gatsby-transformer-sharp together with gatsby-source-contentful.

TimFletcher commented 4 years ago

I was able to tweak the fix from here.

gatsby-node.js

var fs = require("fs")
var dir = "./.cache/caches/@prismicio/gatsby-source-prismic-graphql"

exports.onPreBootstrap = () => {
  if (!fs.existsSync(dir)) {
    fs.mkdirSync(dir, { recursive: true })
  }
}
MarcMcIntosh commented 4 years ago

@TimFletcher interesting :) does it download the file?

MarcMcIntosh commented 4 years ago

@steoneill should be fixed now :)