Startup error reports conflicting versions of graphql

[rhys-vdw]

Hey, just getting started with this project and hitting an issue straight away:

$ npm run dev

> next-shopify-storefront@2.0.0 dev
> nps -s dev

[next] nps is executing `next` : next dev
[graphql] nps is executing `graphql` : nps graphql.download && nps "graphql.codegen --watch"
[next] ready - started server on 0.0.0.0:3000, url: http://localhost:3000
[next] info  - Loaded env from C:\Users\rhysv\Projects\next-shopify-storefront\.env
[graphql] nps is executing `graphql.download` : apollo client:download-schema -c src/services/shopify/apollo.config.js src/services/shopify/schema.gql
[next] info  - Using webpack 4. Reason: webpack5 flag is set to false in next.config.js https://nextjs.org/docs/messages/webpack5
[graphql]  »   Warning: apollo update available from 2.33.6 to 2.33.7.
[graphql] Loading Apollo Project [started]
[next] info  - Using external babel configuration from C:\Users\rhysv\Projects\next-shopify-storefront\.babelrc
[graphql] Loading Apollo Project [completed]
[graphql] Saving schema to src/services/shopify/schema.gql [started]
[graphql] Saving schema to src/services/shopify/schema.gql [failed]
[graphql] → Cannot use GraphQLNonNull "String!" from another module or realm.
[graphql]
[graphql] Ensure that there is only one instance of "graphql" in the node_modules
[graphql] directory. If different versions of "graphql" are the dependencies of other
[graphql] relied on modules, use "resolutions" to ensure only one version is installed.
[graphql]
[graphql] https://yarnpkg.com/en/docs/selective-version-resolutions
[graphql]
[graphql] Duplicate "graphql" modules cannot be used at the same time since different
[graphql] versions may have different capabilities and behavior. The data from one
[graphql] version used in the function from another could produce confusing and
[graphql] spurious results.
[graphql]     Error: Cannot use GraphQLNonNull "String!" from another module or realm.
[graphql]
[graphql]     Ensure that there is only one instance of "graphql" in the node_modules
[graphql]     directory. If different versions of "graphql" are the dependencies of
[graphql]     other
[graphql]     relied on modules, use "resolutions" to ensure only one version is
[graphql]     installed.
[graphql]
[graphql]     https://yarnpkg.com/en/docs/selective-version-resolutions
[graphql]
[graphql]     Duplicate "graphql" modules cannot be used at the same time since
[graphql]     different
[graphql]     versions may have different capabilities and behavior. The data from one
[graphql]     version used in the function from another could produce confusing and
[graphql]     spurious results.
[graphql] The script called "graphql.download" which runs "apollo client:download-schema -c src/services/shopify/apollo.config.js src/services/shopify/schema.gql" failed with exit code 2 https://github.com/sezna/nps/blob/master/other/ERRORS_AND_WARNINGS.md#failed-with-exit-code
[graphql] The script called "graphql" which runs "nps graphql.download && nps "graphql.codegen --watch"" failed with exit code 2 https://github.com/sezna/nps/blob/master/other/ERRORS_AND_WARNINGS.md#failed-with-exit-code
[graphql] nps graphql exited with code 2
--> Sending SIGTERM to other processes..
[next] nps next exited with code 1

You can see that there is one additional version of graphql as a dependency of apollo-language-server:

$ npm list graphql
next-shopify-storefront@2.0.0 C:\Users\rhysv\Projects\next-shopify-storefront
├─┬ @graphql-codegen/cli@2.1.1
│ ├─┬ @graphql-codegen/core@2.1.0
│ │ ├─┬ @graphql-tools/schema@8.2.0
│ │ │ ├─┬ @graphql-tools/merge@8.1.0
│ │ │ │ └── graphql@15.5.2 deduped
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-codegen/plugin-helpers@2.1.1
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/apollo-engine-loader@7.1.0
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/code-file-loader@7.1.0
│ │ ├─┬ @graphql-tools/graphql-tag-pluck@7.1.0
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/git-loader@7.1.0
│ │ ├─┬ @graphql-tools/graphql-tag-pluck@7.1.0
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/github-loader@7.1.0
│ │ ├─┬ @graphql-tools/graphql-tag-pluck@7.1.0
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/graphql-file-loader@7.1.0
│ │ ├─┬ @graphql-tools/import@6.4.0
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/json-file-loader@7.2.0
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/load@7.2.0
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/prisma-loader@7.1.0
│ │ └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/url-loader@7.1.0
│ │ ├─┬ @graphql-tools/delegate@8.2.0
│ │ │ ├─┬ @graphql-tools/batch-execute@8.1.0
│ │ │ │ └── graphql@15.5.2 deduped
│ │ │ └── graphql@15.5.2 deduped
│ │ ├─┬ @graphql-tools/wrap@8.1.0
│ │ │ └── graphql@15.5.2 deduped
│ │ ├─┬ @n1ru4l/graphql-live-query@0.7.1
│ │ │ └── graphql@15.5.2 deduped
│ │ ├─┬ graphql-ws@5.4.1
│ │ │ └── graphql@15.5.2 deduped
│ │ ├── graphql@15.5.2 deduped
│ │ └─┬ subscriptions-transport-ws@0.10.0
│ │   └── graphql@15.5.2 deduped
│ ├─┬ @graphql-tools/utils@8.2.1
│ │ └── graphql@15.5.2 deduped
│ ├─┬ graphql-config@4.0.1
│ │ ├─┬ @graphql-tools/merge@6.2.17
│ │ │ ├─┬ @graphql-tools/utils@8.0.2
│ │ │ │ └── graphql@15.5.2 deduped
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@15.5.2 deduped
│ └── graphql@15.5.2 deduped
├─┬ @graphql-codegen/typescript-graphql-request@4.1.2
│ ├─┬ @graphql-codegen/visitor-plugin-common@2.1.2
│ │ ├─┬ @graphql-tools/optimize@1.1.0
│ │ │ └── graphql@15.5.2 deduped
│ │ ├─┬ @graphql-tools/relay-operation-optimizer@6.4.0
│ │ │ ├── graphql@15.5.2 deduped
│ │ │ └─┬ relay-compiler@11.0.2
│ │ │   └── graphql@15.5.2 deduped
│ │ ├─┬ @graphql-tools/utils@8.1.2
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@15.5.2 deduped
│ └── graphql@15.5.2 deduped
├─┬ @graphql-codegen/typescript-operations@2.1.2
│ └── graphql@15.5.2 deduped
├─┬ @graphql-codegen/typescript@2.1.2
│ └── graphql@15.5.2 deduped
├─┬ apollo@2.33.6
│ ├─┬ apollo-graphql@0.9.3
│ │ └── graphql@15.5.2 deduped
│ ├─┬ apollo-language-server@1.26.4
│ │ ├─┬ @apollo/federation@0.27.0
│ │ │ └── graphql@15.5.2 deduped
│ │ ├─┬ @apollographql/graphql-language-service-interface@2.0.2
│ │ │ ├─┬ @apollographql/graphql-language-service-parser@2.0.2
│ │ │ │ └── graphql@14.7.0 deduped
│ │ │ ├─┬ @apollographql/graphql-language-service-types@2.0.2
│ │ │ │ └── graphql@14.7.0 deduped
│ │ │ ├─┬ @apollographql/graphql-language-service-utils@2.0.2
│ │ │ │ └── graphql@14.7.0 deduped
│ │ │ └── graphql@14.7.0 deduped
│ │ ├─┬ apollo-link-error@1.1.13
│ │ │ └─┬ apollo-link-http-common@0.2.16
│ │ │   └── graphql@15.5.2 deduped
│ │ ├─┬ apollo-link-http@1.5.17
│ │ │ └── graphql@15.5.2 deduped
│ │ ├─┬ apollo-link@1.2.14
│ │ │ ├─┬ apollo-utilities@1.3.4
│ │ │ │ └── graphql@15.5.2 deduped
│ │ │ └── graphql@15.5.2 deduped
│ │ ├─┬ apollo-server-errors@2.5.0
│ │ │ └── graphql@15.5.2 deduped
│ │ └── graphql@14.7.0
│ ├─┬ graphql-tag@2.12.4
│ │ └── graphql@15.5.2 deduped
│ └── graphql@15.5.2 deduped
├─┬ graphql-request@3.5.0
│ └── graphql@15.5.2 deduped
├─┬ graphql-tag@2.12.5
│ └── graphql@15.5.2 deduped
└── graphql@15.5.2

Not sure if I'm on the right path above, but it's a non-starter for me regardless.

[pdeville-ledger]

I had the same error

I was doing npm install

try yarn install instead

Didn't look why there a difference

[VienDinhCom]

Hi @pdeville-ledger @pdeville-ledger I have just released Next Shopify Storefront v3 built with TypeScript, Tailwind CSS, Headless UI, Next.js, React.js, Shopify Hydrogen React,... and Shopify Storefront GraphQL API.

I hope it can solve your problems.