Bug: Module not found: Can't resolve '@emotion/react'

[gr-myles]

Hello, With the recent release of 1.0.0, we are getting missing dependency errors with Voyager. These errors do not show up on rc31.

Module not found: Can't resolve '@emotion/react'

If we manually add it, then it errors on '@emotion/react', etc, etc.

[LunaticMuch]

Can you show some info? Are you installing it asnpm install grapqhl-voyager ?

[gr-myles]

Thanks for the quick response. Installing using yarn v1.22.19, using the yarn install command. Package works when in package.json and we have it pinned as "graphql-voyager": "1.0.0-rc.31",, but if we set to1.0.0 or with the ^ then the missing modules errors ensues. I'd be happy to share any other info needed, please let me know :)

Additional info: We have tried deleting yarn.lock, as well as deleting our modules folder

[LunaticMuch]

Can you share the entire package.json (maybe just a gist...) I tried a simple npm install but did not get any problem

[gr-myles]

Sure thing, here is our dependencies:

"devDependencies": {
    "concurrently": "^5.3.0",
    "nodemon": "^2.0.15",
    "rimraf": "^3.0.2"
  },
  "dependencies": {
    "@aws-amplify/ui": "^3.0.9",
    "@aws-amplify/ui-react": "^2.2.0",
    "@babel/cli": "^7.16.8",
    "@babel/core": "^7.16.12",
    "@babel/plugin-transform-modules-commonjs": "^7.16.8",
    "@graphiql/plugin-explorer": "^0.1.14",
    "@graphiql/react": "^0.17.0",
    "@graphql-tools/graphql-file-loader": "^7.3.3",
    "@graphql-tools/load": "^7.5.1",
    "aws-amplify": "^4.3.13",
    "graphiql": "^2.4.0",
    "graphiql-explorer": "^0.6.3",
    "graphql": "^15.8.0",
    "graphql-voyager": "1.0.0-rc.31",
    "graphql-ws": "^5.11.2",
    "lodash.startcase": "^4.4.0",
    "prop-types": "^15.8.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-icons": "^4.8.0",
    "react-markdown": "^5.0.3",
    "react-scripts": "4.0.3",
    "react-syntax-highlighter": "^15.4.5"
  },

[LunaticMuch]

I did a yarn install with that and got no issue. This is what I found installed:

voyager@1.0.0 /Users/stefano/_TEST/voyager
├── @aws-amplify/ui-react@2.20.0
├── @aws-amplify/ui@3.14.0
├── @babel/cli@7.21.0
├── @babel/core@7.21.3
├── @babel/plugin-transform-modules-commonjs@7.21.2
├── @graphiql/plugin-explorer@0.1.14
├── @graphiql/react@0.17.0
├── @graphql-tools/graphql-file-loader@7.5.16
├── @graphql-tools/load@7.8.13
├── aws-amplify@4.3.46
├── concurrently@5.3.0
├── graphiql-explorer@0.6.3
├── graphiql@2.4.0
├── graphql-voyager@1.0.0
├── graphql-ws@5.12.0
├── graphql@15.8.0
├── lodash.startcase@4.4.0
├── nodemon@2.0.21
├── prop-types@15.8.1
├── react-dom@17.0.2
├── react-icons@4.8.0
├── react-markdown@5.0.3
├── react-scripts@4.0.3
├── react-syntax-highlighter@15.5.0
├── react@17.0.2
└── rimraf@3.0.2

[gr-myles]

Thanks again for your help. Which version of yarn are you using?

[LunaticMuch]

Thanks again for your help. Which version of yarn are you using?

1.22.19

Are you using a third party repository?

[gr-myles]

I did forget to mention, my apologies, we are using a monorepo with a yarn workspace set up, but I didn't think that should affect anything. You were able to compile successfully and run the app with the listed dependencies? Not sure if relevant, but we start our app with this command SKIP_PREFLIGHT_CHECK=true REACT_APP_ENV=local react-scripts start

Thanks again, sounds like this might be specifically a problem on our end, but it is curious that it worked with rc31 and not the new v1. I'm happy to close out this issue if it's specifically our problem :)

[gr-myles]

Another note, if we manually add the @emotion/~~~ dependencies, the next error we get is the following:

/Users/XXXXXX/node_modules/graphql-voyager/dist/voyager.lib.js
Module not found: Can't resolve 'viz.js' in '/Users/XXXX/node_modules/graphql-voyager/dist'

[LunaticMuch]

@gr-myles I did not compile anything. I took your dependencies, as you provided, put them in a brand new package.json and run yarn install. Got everything installed. From the last message it feels you are doing some more, bigger, or different. I might need the exact test case to reproduce.

[IvanGoncharov]

@gr-myles You are right package is broken. Namely, graphql-voyager/dist/voyager.lib.js is fully broken.

@LunaticMuch Thanks for helping with the investigation. I can assume you are using graphql-voyager/dist/voyager.min.js, right? This file is in good shape, so everything should work for you.

I think I know what's broken. I will try to fix it and also we need to add integration tests to prevent this issue in the future.

[IvanGoncharov]

@gr-myles Published 1.0.1 📦 Can you please try it?

[IvanGoncharov]

@gr-myles Based on feedback in https://github.com/IvanGoncharov/graphql-voyager/issues/260 it looks like this issue is fully fixed. Please feel free to reopen this issue if it persists for you.