1.4.0 breaks GraphQL

[ivosabev]

What version of Remix are you using?

1.4.0

Steps to Reproduce

Excerpt from package.json

"dependencies": {
    "@chakra-ui/react": "1.8.8",
    "@emotion/react": "11.9.0",
    "@emotion/styled": "11.8.1",
    "@fortawesome/fontawesome-svg-core": "6.1.1",
    "@fortawesome/pro-light-svg-icons": "6.1.1",
    "@fortawesome/pro-regular-svg-icons": "6.1.1",
    "@fortawesome/pro-solid-svg-icons": "6.1.1",
    "@fortawesome/react-fontawesome": "0.1.18",
    "@graphql-tools/schema": "8.3.8",
    "@graphql-tools/utils": "8.6.7",
    "@hookform/resolvers": "2.8.8",
    "@prisma/client": "3.12.0",
    "@remix-run/express": "1.3.4",
    "@remix-run/node": "1.3.4",
    "@remix-run/react": "1.3.4",
    "@welldone-software/why-did-you-render": "7.0.1",
    "apollo-server-express": "3.6.7",
    "authorizenet": "1.0.8",
    "aws-sdk": "2.1116.0",
    "chalk": "4.1.2",
    "compression": "1.7.4",
    "crypto-js": "4.1.1",
    "dataloader": "2.1.0",
    "debug": "4.3.4",
    "dotenv": "16.0.0",
    "express": "4.17.3",
    "framer-motion": "6.3.0",
    "gm": "1.23.1",
    "graphql": "16.3.0",
    "graphql-relay": "0.10.0",
    "graphql-type-json": "0.3.2",
    "jsonwebtoken": "8.5.1",
    "lodash": "4.17.21",
    "luxon": "2.3.1",
    "morgan": "1.10.0",
    "nanoid": "3.3.2",
    "nodemailer": "6.7.3",
    "object-hash": "3.0.0",
    "papaparse": "5.3.2",
    "pino": "7.10.0",
    "pluralize": "8.0.0",
    "prisma": "3.12.0",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-hook-form": "7.29.0",
    "react-router-dom": "6.3.0",
    "react-virtual": "2.10.4",
    "tailwindcss": "3.0.24",
    "validator": "13.7.0",
    "zod": "3.14.4"
  },
  "devDependencies": {
    "@remix-run/dev": "1.3.4",
    "@tailwindcss/aspect-ratio": "0.4.0",
    "@tailwindcss/forms": "0.5.0",
    "@tailwindcss/line-clamp": "0.3.1",
    "@tailwindcss/typography": "0.5.2",
    "@types/authorizenet": "1.0.0",
    "@types/graphql": "14.5.0",
    "@types/jest": "27.4.1",
    "@types/node": "17.0.24",
    "@types/react": "17.0.43",
    "@types/react-dom": "17.0.14",
    "@types/tailwindcss": "3.0.10",
    "@typescript-eslint/eslint-plugin": "5.19.0",
    "@typescript-eslint/parser": "5.19.0",
    "autoprefixer": "10.4.4",
    "dotenv-cli": "5.1.0",
    "esbuild": "0.14.36",
    "esbuild-register": "3.3.2",
    "eslint": "8.13.0",
    "eslint-config-airbnb": "19.0.4",
    "eslint-config-airbnb-typescript": "17.0.0",
    "eslint-config-prettier": "8.5.0",
    "eslint-import-resolver-typescript": "2.7.1",
    "eslint-plugin-import": "2.26.0",
    "eslint-plugin-jsx-a11y": "6.5.1",
    "eslint-plugin-prettier": "4.0.0",
    "eslint-plugin-react": "7.29.4",
    "eslint-plugin-react-hooks": "4.4.0",
    "eslint-plugin-sort-destructure-keys": "1.4.0",
    "eslint-plugin-sort-keys-fix": "1.1.2",
    "jest": "27.5.1",
    "npm-check": "5.9.2",
    "pm2": "5.2.0",
    "postcss": "8.4.12",
    "postcss-cli": "9.1.0",
    "postcss-import": "14.1.0",
    "prettier": "2.6.2",
    "prettier-plugin-tailwindcss": "0.1.8",
    "ts-jest": "27.1.4",
    "typescript": "4.6.3"
  },

Expected Behavior

No errors :)

Actual Behavior

This is the error I get:

server-2  | Error: Cannot use GraphQLObjectType "Address" from another module or realm.
server-2  | Ensure that there is only one instance of "graphql" in the node_modules
server-2  | directory. If different versions of "graphql" are the dependencies of other
server-2  | relied on modules, use "resolutions" to ensure only one version is installed.
server-2  | https://yarnpkg.com/en/docs/selective-version-resolutions
server-2  | Duplicate "graphql" modules cannot be used at the same time since different
server-2  | versions may have different capabilities and behavior. The data from one
server-2  | version used in the function from another could produce confusing and
server-2  | spurious results.
server-2  |     at instanceOf2 (/Users/ivolution/Sites/koop/node_modules/graphql/jsutils/instanceOf.js:43:19)
server-2  |     at isObjectType (/Users/ivolution/Sites/koop/node_modules/graphql/type/definition.js:131:26)
server-2  |     at printType (/Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:134:23)
server-2  |     at /Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:59:28
server-2  |     at Array.map (<anonymous>)
server-2  |     at printFilteredSchema (/Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:59:14)
server-2  |     at printSchema2 (/Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:31:10)
server-2  |     at Object.<anonymous> (/Users/ivolution/Sites/koop/app/graphql/index.server.ts:85:61)
server-2  |     at Module._compile (node:internal/modules/cjs/loader:1101:14)
server-2  |     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
server-2  | Error: Cannot use GraphQLObjectType "Address" from another module or realm.
server-2  | Ensure that there is only one instance of "graphql" in the node_modules
server-2  | directory. If different versions of "graphql" are the dependencies of other
server-2  | relied on modules, use "resolutions" to ensure only one version is installed.
server-2  | https://yarnpkg.com/en/docs/selective-version-resolutions
server-2  | Duplicate "graphql" modules cannot be used at the same time since different
server-2  | versions may have different capabilities and behavior. The data from one
server-2  | version used in the function from another could produce confusing and
server-2  | spurious results.
server-2  |     at instanceOf2 (/Users/ivolution/Sites/koop/node_modules/graphql/jsutils/instanceOf.js:43:19)
server-2  |     at isObjectType (/Users/ivolution/Sites/koop/node_modules/graphql/type/definition.js:131:26)
server-2  |     at printType (/Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:134:23)
server-2  |     at /Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:59:28
server-2  |     at Array.map (<anonymous>)
server-2  |     at printFilteredSchema (/Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:59:14)
server-2  |     at printSchema2 (/Users/ivolution/Sites/koop/node_modules/graphql/utilities/printSchema.js:31:10)
server-2  |     at Object.<anonymous> (/Users/ivolution/Sites/koop/app/graphql/index.server.ts:85:61)
server-2  |     at Module._compile (node:internal/modules/cjs/loader:1101:14)
server-2  |     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)

The error happens when I call printSchema from graphql

Downgrading to 1.3.4 fixes the issue.

[MichaelDeBoey]

@ivosabev Can you please create a minimal reproduction with as little as possible/needed dependencies?
This will make it easier for the team to find out where the problem could be.

[julioxavierr]

@ivosabev

This is likely happening because you have two versions of GraphQL in your lock file (i.e. package-lock.json or yarn.lock)

You can either figure out what dependencies need graphql and update them or use a resolution:

https://classic.yarnpkg.com/lang/en/docs/selective-version-resolutions/

[ivosabev]

I do not think that is the case. Here is my graphql dependency graph, which shows I only use [email protected]:

[email protected] /Users/xxx/koop
├─┬ @graphql-tools/[email protected]
│ ├─┬ @graphql-tools/[email protected]
│ │ └── [email protected] deduped
│ └── [email protected] deduped
├─┬ @graphql-tools/[email protected]
│ └── [email protected] deduped
├─┬ [email protected]
│ ├─┬ [email protected]
│ │ ├─┬ @apollographql/[email protected]
│ │ │ └── [email protected] deduped
│ │ ├─┬ @graphql-tools/[email protected]
│ │ │ ├─┬ @graphql-tools/[email protected]
│ │ │ │ ├─┬ @graphql-tools/[email protected]
│ │ │ │ │ └── [email protected] deduped
│ │ │ │ └── [email protected] deduped
│ │ │ ├─┬ @graphql-tools/[email protected]
│ │ │ │ └── [email protected] deduped
│ │ │ └── [email protected] deduped
│ │ ├─┬ [email protected]
│ │ │ └── [email protected] deduped
│ │ ├─┬ [email protected]
│ │ │ └── [email protected] deduped
│ │ ├─┬ [email protected]
│ │ │ └── [email protected] deduped
│ │ └── [email protected] deduped
│ ├─┬ [email protected]
│ │ └── [email protected] deduped
│ └── [email protected] deduped
├─┬ [email protected]
│ └── [email protected] deduped
├─┬ [email protected]
│ └── [email protected] deduped
└── [email protected]

Also this error does not exist on 1.3.4.

Unfortunately I do not have the ability to create a simple test project, because the codebase is too big and it will take me forever to simplify it.

[machour]

Is the dependency graph you're showing the one you get when upgrading to 1.4.0 or with 1.3.4 ?

[ivosabev]

It is not changing between updates, it is the same for 1.3.4 and 1.4.1

These are the remix packages I am upgrading.

@remix-run/express 1.3.4 ❯ 1.4.1
@remix-run/node 1.3.4 ❯ 1.4.1
@remix-run/react 1.3.4 ❯ 1.4.1
remix 1.3.4 ❯ 1.4.1
@remix-run/dev 1.3.4 ❯ 1.4.1

[ivosabev]

I've narrowed it down to having a folder app/graphql that is accessible through a TypeScript global import with ~/* and in one of my route files I am doing

import {graphql} from 'graphql';
import {schema} from '~/graphql';

and the [email protected] after the removal of the postinstall script is treating it as a duplication somehow.

[machour]

@ivosabev is this still a problem with 1.7.5?
A lot of things changed, and I'm trying to see what issues are still relevant

[github-actions]

This issue has been automatically closed because we haven't received a response from the original author 🙈. This automation helps keep the issue tracker clean from issues that are unactionable. Please reach out if you have more information for us! 🙂