gatsbyjs / gatsby

The best React-based framework with performance, scalability and security built in.
https://www.gatsbyjs.com
MIT License
55.26k stars 10.32k forks source link

Cannot run any of my gatsby files anymore #37031

Closed judepark closed 1 year ago

judepark commented 1 year ago

Preliminary Checks

Description

I updated npm and gatsby version and my previous files that used to work no longer runs, when I run gatsby develop it breaks. It seems like a plugin issue with graphql but I don't know what is breaking my code with various errors:

[jude-park-gatsby]/[gatsby]/[bluebird]/js/release/promise.js:547:31

"gatsby-transformer-sharp" threw an error while running the setFieldsOnGraphQLNodeType lifecycle:

Class constructor GraphQLList cannot be invoked without 'new'

TypeError: Class constructor GraphQLList cannot be invoked without 'new'

"gatsby-transformer-sharp" threw an error while running the setFieldsOnGraphQLNodeType lifecycle:

Class constructor GraphQLList cannot be invoked without 'new'

TypeError: Class constructor GraphQLList cannot be invoked without 'new'

success building schema - 0.677s success createPages - 0.066s success createPagesStatefully - 0.151s info Total nodes: 232, SitePage nodes: 23 (use --verbose for breakdown)
success Checking for changed pages - 0.001s
success write out redirect data - 0.003s
warn The icon(src/assets/img/logo.png) you provided to 'gatsby-plugin-manifest' is not square.
The icons we generate will be square and for the best results we recommend you provide a square icon.

success Build manifest and related icons - 0.140s success onPostBootstrap - 0.147s info bootstrap finished - 12.676s
success onPreExtractQueries - 0.006s warn Deprecated syntax of sort and/or aggregation field arguments were found in your query (see https://gatsby.dev/graphql-nested-sort-and-aggregate). Query was automatically converted to a new syntax. You should update query in your code.

File: C:/Users/jude/jude-park-gatsby/src/pages/about.js

Current query:

query AboutQuery { allMarkdownRemark(sort: {fields: [frontmatter___date], order: DESC}) { edges { node { fields { slug } frontmatter { title notebrief color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories } } } } }

Converted query:

query AboutQuery { allMarkdownRemark(sort: {frontmatter: {date: DESC}}) { edges { node { fields { slug } frontmatter { title notebrief color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories } } } } } warn Deprecated syntax of sort and/or aggregation field arguments were found in your query (see https://gatsby.dev/graphql-nested-sort-and-aggregate). Query was automatically converted to a
new syntax. You should update query in your code.

File: C:/Users/jude/jude-park-gatsby/src/pages/index.js

Current query:

query ProjectQuery { allMarkdownRemark(sort: {fields: [frontmatter___date], order: DESC}) { edges { node { fields { slug } frontmatter { title notebrief color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories } } } } }

Converted query:

query ProjectQuery { allMarkdownRemark(sort: {frontmatter: {date: DESC}}) { edges { node { fields { slug } frontmatter { title notebrief color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories } } } } } warn Deprecated syntax of sort and/or aggregation field arguments were found in your query (see https://gatsby.dev/graphql-nested-sort-and-aggregate). Query was automatically converted to a new syntax. You should update query in your code.

File: C:/Users/jude/jude-park-gatsby/src/pages/research.js

Current query:

query ResearchQuery { allMarkdownRemark( sort: {fields: [frontmatter___date], order: DESC} filter: {fileAbsolutePath: {regex: "/research/"}} ) { edges { node { fields { slug } frontmatter { title notebrief color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories date(formatString: "MMM D, YYYY") } } } } }

Converted query:

query ResearchQuery { allMarkdownRemark( sort: {frontmatter: {date: DESC}} filter: {fileAbsolutePath: {regex: "/research/"}} ) { edges { node { fields { slug } frontmatter { title notebrief color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories date(formatString: "MMM D, YYYY") } } } } } warn Deprecated syntax of sort and/or aggregation field arguments were found in your query (see https://gatsby.dev/graphql-nested-sort-and-aggregate). Query was automatically converted to a new syntax. You should update query in your code.

File: C:/Users/jude/jude-park-gatsby/src/pages/work.js

Current query:

query WorkQuery { allMarkdownRemark( sort: {fields: [frontmatter___date], order: DESC} filter: {fileAbsolutePath: {regex: "/work/"}} ) { edges { node { fields { slug } frontmatter { title worksummary workheading color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories date(formatString: "YYYY") } } } } }

Converted query:

query WorkQuery { allMarkdownRemark( sort: {frontmatter: {date: DESC}} filter: {fileAbsolutePath: {regex: "/work/"}} ) { edges { node { fields { slug } frontmatter { title worksummary workheading color image { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } thumb { childImageSharp { fluid(maxWidth: 900) { ...GatsbyImageSharpFluid } } } categories date(formatString: "YYYY") } } } } }

ERROR #85901 GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

GraphQL request:2:37 1 | 2 | fragment GatsbyImageSharpFluid on ImageSharpFluid { | ^ 3 | base64

File: src\pages\about.js:648:37

GraphQLError: Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\about.js:661:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85923 GRAPHQL

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\about.js:668:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85901 GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

GraphQL request:2:37 1 | 2 | fragment GatsbyImageSharpFluid on ImageSharpFluid { | ^ 3 | base64

File: src\pages\index.js:440:37

GraphQLError: Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\index.js:453:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85923 GRAPHQL

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\index.js:460:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85901 GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

GraphQL request:2:37 1 | 2 | fragment GatsbyImageSharpFluid on ImageSharpFluid { | ^ 3 | base64

File: src\pages\research.js:321:37

GraphQLError: Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\research.js:337:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85923 GRAPHQL

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\research.js:344:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85901 GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

GraphQL request:2:37 1 | 2 | fragment GatsbyImageSharpFluid on ImageSharpFluid { | ^ 3 | base64

File: src\pages\work.js:293:37

GraphQLError: Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\work.js:310:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85923 GRAPHQL

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\pages\work.js:317:7

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85901 GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

GraphQL request:2:37 1 | 2 | fragment GatsbyImageSharpFluid on ImageSharpFluid { | ^ 3 | base64

File: src\templates\research.js:470:37

GraphQLError: Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\templates\research.js:487:8

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

ERROR #85901 GRAPHQL

There was an error in your GraphQL query:

Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

GraphQL request:2:37 1 | 2 | fragment GatsbyImageSharpFluid on ImageSharpFluid { | ^ 3 | base64

File: src\templates\work.js:499:37

GraphQLError: Unknown type "ImageSharpFluid". Did you mean "ImageSharp" or "ImageSharpEdge"?

There was an error in your GraphQL query:

Cannot query field "fluid" on type "ImageSharp".

If you don't expect "fluid" to exist on the type "ImageSharp" it is most likely a typo. However, if you expect "fluid" to exist there are a couple of solutions to common problems:

It is recommended to explicitly type your GraphQL schema if you want to use optional fields.

File: src\templates\work.js:520:8

See our docs page for more info on this error: https://gatsby.dev/creating-type-definitions

failed extract queries from components - 1.175s warn The GraphQL query in the non-page component
"C:/Users/jude/jude-park-gatsby/src/disabled/photography.js" will not be run. Exported queries are only executed for page components. It's possible you're trying to create
pages in your gatsby-node.js and that's failing for some reason.

If the failing component is a regular component and not intended to be a page component, you
generally want to use "useStaticQuery" (https://www.gatsbyjs.com/docs/how-to/querying-data/use-static-query/) instead of exporting a
page query.

If you're more experienced with GraphQL, you can also export GraphQL fragments from components
and compose the fragments in the Page component query and pass data down into the child component (https://www.gatsbyjs.com/docs/reference/graphql-data-layer/using-graphql-fragments/) success write out requires - 0.049s

ERROR

Module not found: Error: Can't resolve 'gatsby-core-utils/create-content-digest' in 'C:\Users\jude\jude-park-gatsby.cache\slice'

ModuleNotFoundError: Module not found: Error: Can't resolve 'gatsby-core-utils/create-content- digest' in 'C:\Users\jude\jude-park-gatsby.cache\slice'

not finished Building development bundle - 3.223s

Reproduction Link

https://github.com/judepark/jude-park-gatsby

Steps to Reproduce

  1. run "gatsby develop"

Expected Result

the environment should run as normal as it always had

Actual Result

cannot run environment due to errors

Environment

System:
    OS: Windows 10 10.0.22000
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 18.12.1 - C:\Program Files\nodejs\node.EXE
    npm: 8.19.2 - C:\Program Files\nodejs\npm.CMD
  Languages:
    Python: 3.8.3
  Browsers:
    Chrome: 107.0.5304.107
    Edge: Spartan (44.22000.120.0), Chromium (107.0.1418.42)
  npmPackages:
    gatsby: ^5.0.1 => 5.0.1
    gatsby-image: ^2.2.17 => 2.2.17
    gatsby-plugin-google-analytics: ^2.1.14 => 2.1.14
    gatsby-plugin-layout: ^1.1.6 => 1.1.6
    gatsby-plugin-manifest: ^2.2.13 => 2.2.13
    gatsby-plugin-react-helmet: ^3.1.6 => 3.1.6
    gatsby-plugin-sharp: ^2.2.19 => 2.2.19
    gatsby-plugin-styled-components: ^3.1.4 => 3.1.4
    gatsby-remark-embed-video: ^3.0.10 => 3.0.10
    gatsby-remark-images: ^3.1.20 => 3.1.20
    gatsby-remark-images-medium-zoom: ^1.2.1 => 1.2.1
    gatsby-remark-responsive-iframe: ^2.4.5 => 2.4.5
    gatsby-source-filesystem: ^2.1.21 => 2.1.21
    gatsby-transformer-remark: ^2.6.21 => 2.6.21
    gatsby-transformer-sharp: ^2.2.13 => 2.2.13
  npmGlobalPackages:
    gatsby-cli: 5.0.0

Config Flags

No response

tyhopp commented 1 year ago

Hi @judepark, please follow the Gatsby 4 to 5 migration guide if you haven't already.

If you still encounter a specific issue after following the migration guide, feel free to ask in the Gatsby 5 umbrella discussion or open a new issue with a minimal reproduction.