gatsby-transformer-sharp fragments fails GraphQL - Unknown Types

Created on 11 Jul 2019  Â·  14Comments  Â·  Source: gatsbyjs/gatsby

Description

Running deploy (build) on Netlify results in error #85901 GRAPHQL.
Full error:

1:15:42 AM: error #85901 GRAPHQL
1:15:42 AM: There was an error in your GraphQL query:
1:15:42 AM: Unknown type "ImageSharpFixed".
1:15:42 AM: File: node_modules/gatsby-transformer-sharp/src/fragments.js:5:56
1:15:42 AM: See our docs page for more info on this error: https://gatsby.dev/issue-how-to

Commenting out file node_modules/gatsby-transformer-sharp/src/fragments.js solves the issue locally.

Steps to reproduce

Push project to Git repo and initiate Netlify build hook.

Expected result

The build should succeed and the site should publish.

Actual result

The build fails.

Environment

System:
    OS: Windows 7
    CPU: (8) x64 Intel(R) Core(TM) i7-3610QM CPU @ 2.30GHz
  Binaries:
    npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
  npmPackages:
    gatsby: ^2.13.9 => 2.13.9
    gatsby-cli: ^2.7.8 => 2.7.8
    gatsby-image: ^2.2.4 => 2.2.4
    gatsby-plugin-catch-links: ^2.1.0 => 2.1.0
    gatsby-plugin-feed: ^2.3.2 => 2.3.2
    gatsby-plugin-google-analytics: ^2.1.1 => 2.1.1
    gatsby-plugin-manifest: ^2.2.1 => 2.2.1
    gatsby-plugin-offline: ^2.2.1 => 2.2.1
    gatsby-plugin-prefetch-google-fonts: ^1.4.2 => 1.4.2
    gatsby-plugin-react-helmet: ^3.1.0 => 3.1.0
    gatsby-plugin-sass: ^2.1.0 => 2.1.0
    gatsby-plugin-sharp: ^2.2.3 => 2.2.3
    gatsby-plugin-sw: ^1.0.1 => 1.0.1
    gatsby-remark-relative-links: 0.0.3 => 0.0.3
    gatsby-source-filesystem: ^2.1.2 => 2.1.2
    gatsby-source-wordpress: ^3.1.4 => 3.1.4
    gatsby-transformer-sharp: ^2.2.1 => 2.2.1

error The system cannot find the path specified.

This is a copy and pasted version of the rest of my package.json picking up immediately after the error:

    "node-fetch": "^2.6.0",
    "node-sass": "^4.12.0",
    "prop-types": "^15.7.2",
    "react": "^16.8.6",
    "react-custom-share": "^0.4.8",
    "react-dom": "^16.8.6",
    "react-helmet": "^5.2.1",
    "react-icons": "^3.7.0",
    "urlencode": "^1.1.0",
    "wpapi": "^1.2.1"
  },
  "scripts": {
    "build": "gatsby build",
    "build funcs": "netlify-lambda build src/lambda",
    "serve funcs": "netlify-lambda serve src/lambda",
    "run funcs": "netlify-lambda build src/lambda && netlify-lambda serve src/lambda",
    "test": "echo \"Write tests! -> https://gatsby.app/unit-testing\""
  },
  "devDependencies": {
    "dotenv": "^8.0.0",
    "netlify-lambda": "^1.5.0"
  }

gatsby-config.js

module.exports = {
   siteMetadata: {
      title: `Stumbling Towards Enlightenment`,
      description: `Spiritual writings on ...`,
      author: `Mickey Mouse`,
      siteUrl: 'https://stumblingtowardsenlightenment.com'
   },
   plugins: [
      'gatsby-plugin-sass',
      {
         resolve: `gatsby-plugin-feed`,
         options: {
            query: `
               {
                  site {
                     siteMetadata {
                        title
                        siteUrl
                        site_url: siteUrl
                     }
                  }
               }
            `,
            feeds: [
               {
                  serialize: ({ query: { site, allWordpressPost } }) => {
                     return allWordpressPost.edges.map(edge => {
                        let decodeHtmlEntity = function(str) {
                           return str.replace(/&#(\d+);/g, function(match, dec) {
                              return String.fromCharCode(dec);
                           });
                        };
                        return Object.assign({}, {
                           title: decodeHtmlEntity(edge.node.title),
                           description: decodeHtmlEntity(edge.node.excerpt),
                           url: edge.node.link,
                           guid: edge.node.id,
                           date: edge.node.date,
                        })
                     })
                  },
                  query: `
                     {
                        allWordpressPost(
                           limit: 100,
                           sort: { fields: [date], order: DESC }
                        ) {
                           edges {
                              node {
                                 title
                                 date(formatString: "MMMM DD, YYYY")
                                 modified(formatString: "MMMM DD, YYYY")
                                 slug
                                 link
                                 excerpt
                                 wordpress_id
                                 content
                                 id
                              }
                           }
                        }
                     }
                  `,
                  output: "/rss.xml",
                  title: "Stumbling Towards Enlightenment Feed"
               },
            ],
        },
      },
      {
         resolve: `gatsby-plugin-manifest`,
         options: {
            name: `Stumbling Towards Enlightenment`,
            short_name: `Stumbling Towards Enlightenment`,
            start_url: `/`,
            background_color: `#663399`,
            theme_color: `#663399`,
            display: `minimal-ui`,
         },
      },
      {
         resolve: `gatsby-source-wordpress`,
         options: {
            baseUrl: `stumblingtowardsenlightenment.com`,
            protocol: `https`,
            hostingWPCOM: false,
            verboseOutput: true,
            useACF: false
         }
      },
      {
         resolve: `gatsby-plugin-google-analytics`,
         options: {
            trackingId: process.env.GA_TRACKING_CODE,
            head: false,
            respectDNT: true,
         },
      },
      {
         resolve: `gatsby-plugin-prefetch-google-fonts`,
         options: {
            fonts: [
               {
                  family: 'Anton'
               },
               {
                  family: 'Open Sans',
                  variants: [
                     '300','300i','400','400i','700','700i','900'
                  ]
               },
               {
                  family: 'Just Another Hand'
               }
            ],
         },
      }
   ]
}

gatsby-node.js

const path = require('path')
const { createFilePath } = require(`gatsby-source-filesystem`)

exports.createPages = ({ graphql, actions }) => {
    const { createPage } = actions

    return new Promise((resolve, reject) => {
        graphql(`
            {
                allWordpressPost {
                    edges {
                    node {
                            title
                            date(formatString: "MMMM DD, YYYY")
                            modified(formatString: "MMMM DD, YYYY")
                            slug
                            link
                            excerpt
                            wordpress_id
                            content
                            id
                    }
                    }
                }
            allWordpressWpComments {
               edges {
                  node {
                     author {
                        name
                     }
                     content
                     post
                  }
               }
            }
            }
        `).then(result => {
         console.log('logging result: ', result);
            result.data.allWordpressPost.edges.forEach(({ node }) => {
                createPage({
                    path: node.slug,
                    component: path.resolve('./src/templates/post.js'),
                    context: {
                        id: node.id,
                        title: node.slug,
                        content: node.content,
                  comments: result.data.allWordpressWpComments
                    }
                })
            })
            resolve()
        }).catch(error => {
            console.log(error)
            reject(error)
        })
    })
}

Most helpful comment

For me, it turns out I didn't have gatsby-transformer-sharp and gatsby-plugin-sharp on my plugins array and it resulted in failed builds. I don't know how I have been building successfully before though.

All 14 comments

Maybe it is not a problem of gatsby-transformer-sharp itself - try to downgrade to gatsby v11 (yarn add [email protected]) it could "help".

I'm facing the same issue and I've just tested all v12 and v13 of Gatsby and the result is still same - build phase throws:

ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpSizes".

File: node_modules\gatsby-transformer-sharp\src\fragments.js:5:47

I met the same error.
The problem is because I was using Hyper terminal in windows.
Solution is using the default terminal in windows.

Hitting the same issue:

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: node_modules/gatsby-transformer-sharp/src/fragments.js:5:46

and this error:

/src/pages/index.js
error  Cannot query field "file" on type "Query". Did you mean "site"? 

Any idea how to fix?

Rolling back to gatsby v2.10.0 resolved the issue for me. More info at this
thread
https://spectrum.chat/gatsby-js/general/build-script-returned-non-zero-exit-code-1~619d3d86-1706-41c7-b16b-7be42e4be679
.

On Sun, Jul 14, 2019 at 10:48 PM Emad Abdulrahim notifications@github.com
wrote:

Hitting the same issue:

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: node_modules/gatsby-transformer-sharp/src/fragments.js:5:46

and this error:

/src/pages/index.js
error Cannot query field "file" on type "Query". Did you mean "site"? ```Any idea how to fix?

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
https://github.com/gatsbyjs/gatsby/issues/15625?email_source=notifications&email_token=ADGRBHMF2GOOH3PAGHJOFXDP7QFSXA5CNFSM4IA23CT2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODZ4YL5Y#issuecomment-511280631,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ADGRBHJIBD7IA7Q2DA634WDP7QFSXANCNFSM4IA23CTQ
.

--
David Gaskin
(778) 587-9220

I haven't been able to get a successful build for some time, with a longer error output:

 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFixed".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:37


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFixed".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:47


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFixed".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:46


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFixed".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:56


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFixed".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:46


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFixed".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:55


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:37


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:47


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:46


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:56


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:46


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:55


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpResolutions".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:43


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpResolutions".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:53


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpResolutions".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:52


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpResolutions".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:62


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpResolutions".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:52


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpResolutions".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:61


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpSizes".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:37


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpSizes".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:47


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpSizes".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:46


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpSizes".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:56


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpSizes".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:46


 ERROR #85901  GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpSizes".

File: ..\..\node_modules\gatsby-transformer-sharp\src\fragments.js:5:55

Getting same error, tried Gatsby 2.7, 2.10, 2.13, also tried updating gatsby-image to 2.2.6 and gatsby-transformer-sharp to 2.2.7

Sorry to hear you're running into an issue. To help us best begin debugging the underlying cause, it is incredibly helpful if you're able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it.

If you're up for it, we'd very much appreciate if you could provide a minimal reproduction and we'll be able to take another look.

Thanks for using Gatsby! 💜

For me, it turns out I didn't have gatsby-transformer-sharp and gatsby-plugin-sharp on my plugins array and it resulted in failed builds. I don't know how I have been building successfully before though.

That's what I was thinking at first but the environment snippet threw me off.

It seems like you're right @th0th, in the provided config gatsby-plugin-sharp & gatsby-transformer-sharp is missing.

Good catch @th0th, thanks! 💪

It seems like I provided enough information.

🤔 I'm a total Gatsby newbie and just learning it by converting my blog from Hugo => Gatsby. I'm trying to build it with gatsby-themes and I have the same issue. I had the gatsby-plugin-sharp and gatsby-transformer-sharp in my blog theme's config, but it didn't compile unless I downgraded Gatsby from 2.13.50 to 2.10.0.

(I'm using a yarn workspace, but that shouldn't matter I guess)

@th0th gave the solution for me. In my case I was missing only gatsby-transformer-sharp.

I'm getting this issue on an almost empty gatsby site. Omitted gatsby-config.js, or an empty module.exports = {} still give me this issue. Only fixed when I set the gatsby-transformer-sharp plugin..

Seems having it in your installed in your package.json and not using it will throw this error, will make an issue..

As @wesbos says, this error can throw when gatsby-transformer-sharp is installed but the plugin is not added to gatsby-config.js. This is problematic with yarn workspaces and the gatsby-transformer-sharp plugin is used in a separate workspace, which makes it a hassle to develop multiple themes in a single repo.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Oppenheimer1 picture Oppenheimer1  Â·  3Comments

totsteps picture totsteps  Â·  3Comments

timbrandin picture timbrandin  Â·  3Comments

dustinhorton picture dustinhorton  Â·  3Comments

rossPatton picture rossPatton  Â·  3Comments