gatsbyjs / gatsby

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

Gatsby 2.13.50 installing incompatible gatsby-cli #18728

Closed aharris closed 4 years ago

aharris commented 5 years ago

Description

Gatsby 2.13.50 uses a ^ to include gatsby-cli. This lead to in npm install causing us to pull in an incompatible version of the gatsby cli.

image

This version causes the error:

The above error occurred in the <ReduxStoreProvider> component:
    in ReduxStoreProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.

Steps to reproduce

In an existing project running gatsby@2.13.50

Clear steps describing how to reproduce the issue. Please please please link to a demo project if possible, this makes your issue much easier to diagnose (seriously).

How to Make a Minimal Reproduction: https://www.gatsbyjs.org/contributing/how-to-make-a-reproducible-test-case/

Expected result

The app builds.

Actual result

The above error occurred in the <ReduxStoreProvider> component:
    in ReduxStoreProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.

Environment

node v10.16.3 npm 6.9.0

package.json:

    "dependencies": {
        "axios": "0.19.0",
        "gatsby": "2.13.50",
        "gatsby-image": "2.2.8",
        "gatsby-plugin-env-variables": "1.0.1",
        "gatsby-plugin-google-analytics": "2.1.21",
        "gatsby-plugin-google-tagmanager": "2.1.13",
        "gatsby-plugin-intl": "0.2.8",
        "gatsby-plugin-manifest": "2.2.4",
        "gatsby-plugin-offline": "2.2.4",
        "gatsby-plugin-postcss": "2.1.4",
        "gatsby-plugin-react-helmet": "3.1.3",
        "gatsby-plugin-react-svg": "2.1.2",
        "gatsby-plugin-sass": "2.1.8",
        "gatsby-plugin-sharp": "2.2.9",
        "gatsby-plugin-typescript": "2.1.2",
        "gatsby-source-filesystem": "2.1.8",
        "gatsby-transformer-sharp": "2.2.5",
        "graphql": "14.4.2",
        "node-sass": "4.12.0",
        "prop-types": "15.7.2",
        "query-string": "5.1.1",
        "react": "16.8.6",
        "react-dom": "16.8.6",
        "react-google-login": "5.0.5",
        "react-helmet": "5.2.1",
        "react-recaptcha-v3": "1.1.0",
        "react-simple-keyboard": "2.0.4",
        "react-transition-group": "4.2.2",
        "ts-optchain": "0.1.8"
    },
    "devDependencies": {
        "@babel/core": "7.5.5",
        "@babel/plugin-proposal-optional-chaining": "7.6.0",
        "@graphql-codegen/cli": "1.4.0",
        "@graphql-codegen/typescript": "1.4.0",
        "@graphql-codegen/typescript-operations": "1.4.0",
        "@types/aws-sdk": "2.7.0",
        "@types/facebook-js-sdk": "3.3.0",
        "@types/node": "12.6.9",
        "@types/react-dom": "16.8.5",
        "@types/react-helmet": "5.0.8",
        "@types/react-intl": "2.3.18",
        "@typescript-eslint/eslint-plugin": "2.0.0",
        "@typescript-eslint/parser": "1.13.0",
        "eslint": "6.1.0",
        "eslint-config-prettier": "6.0.0",
        "eslint-plugin-react": "7.14.2",
        "postcss-pxtorem": "4.0.1",
        "prettier": "1.18.2",
        "prettier-tslint": "0.4.2",
        "resolve-url-loader": "3.1.0",
        "typescript": "3.5.3"
    },

Run gatsby info --clipboard in your project directory and paste the output here.

$ gatsby info --clipboard

  System:
    OS: macOS 10.14.6
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.16.0 - ~/.nvm/versions/node/v10.16.0/bin/node
    Yarn: 1.17.3 - ~/.nvm/versions/node/v10.16.0/bin/yarn
    npm: 6.10.1 - ~/.nvm/versions/node/v10.16.0/bin/npm
  Languages:
    Python: 2.7.10 - /usr/bin/python
  Browsers:
    Chrome: 77.0.3865.120
    Firefox: 67.0.2
    Safari: 13.0.2
  npmPackages:
    gatsby: 2.13.50 => 2.13.50
    gatsby-image: 2.2.8 => 2.2.8
    gatsby-plugin-env-variables: 1.0.1 => 1.0.1
    gatsby-plugin-google-analytics: 2.1.21 => 2.1.21
    gatsby-plugin-google-tagmanager: 2.1.13 => 2.1.13
    gatsby-plugin-intl: 0.2.8 => 0.2.8
    gatsby-plugin-manifest: 2.2.4 => 2.2.4
    gatsby-plugin-offline: 2.2.4 => 2.2.4
    gatsby-plugin-postcss: 2.1.4 => 2.1.4
    gatsby-plugin-react-helmet: 3.1.3 => 3.1.3
    gatsby-plugin-react-svg: 2.1.2 => 2.1.2
    gatsby-plugin-sass: 2.1.8 => 2.1.8
    gatsby-plugin-sharp: 2.2.9 => 2.2.9
    gatsby-plugin-typescript: 2.1.2 => 2.1.2
    gatsby-source-filesystem: 2.1.8 => 2.1.8
    gatsby-transformer-sharp: 2.2.5 => 2.2.5
  npmGlobalPackages:
    gatsby-cli: 2.7.58
aharris commented 5 years ago

I was able to resolve this eventually locally by deleting my global gatsby-cli and specifying the old gatsby-cli directly:

"gatsby": "2.13.50",
"gatsby-cli": "2.7.26"

Debugging this issue though caused significant down time that could be resolved by using exact version.

pieh commented 5 years ago

Hey, are you able to share your project? I was able to reproduce some issue with following package versions:

➜  i18728 git:(master) ✗ npm list gatsby-cli
gatsby-starter-default@0.1.0 /Users/misiek/test/i18728
└─┬ gatsby@2.13.50
  └── gatsby-cli@2.8.1

But issue I had was different than one you reported:

⠀
/Users/misiek/test/i18728/node_modules/yoga-layout-prebuilt/yoga-layout/build/Release/nbind.js:53
        throw ex;
        ^

TypeError: report._setStage is not a function

I'll work on fixing that part, but it seems like completely different issue than you had

adstr123 commented 5 years ago

@pieh I had the same issue as you after updating gatsby-cli where the yoga-layout-prebuilt module was throwing the error, but I imagine these are related.

Environment

Node 12.4.0 npm 6.10.3

package.json: { "dependencies": { "bootstrap": "^4.3.1", "gatsby": "^2.15.29", "gatsby-cli": "^2.8.1", "gatsby-image": "^2.2.24", "gatsby-plugin-manifest": "^2.2.20", "gatsby-plugin-netlify-cms": "^4.1.22", "gatsby-plugin-offline": "^2.2.10", "gatsby-plugin-react-helmet": "^3.1.10", "gatsby-plugin-sass": "^2.1.17", "gatsby-plugin-sharp": "^2.2.28", "gatsby-source-filesystem": "^2.1.29", "gatsby-transformer-json": "^2.2.12", "gatsby-transformer-remark": "^2.6.27", "gatsby-transformer-sharp": "^2.2.20", "netlify-cms": "^2.9.7", "node-sass": "^4.12.0", "react": "^16.10.2", "react-bootstrap": "^1.0.0-beta.14", "react-dom": "^16.10.2", "react-helmet": "^5.2.1", "react-image-video-lightbox": "^2.0.1", "react-modal": "^3.10.1", "react-on-screen": "^2.1.1", "react-player": "^1.13.0", "react-reading-progress": "^0.3.0", "react-responsive": "^8.0.1", "react-scroll-parallax": "^2.2.0", "react-scrollchor": "^6.0.0", "react-transition-group": "^4.3.0", "read-more-react": "^1.0.9", "slick-carousel": "^1.8.1", "slugify": "^1.3.5" }, "devDependencies": { "prettier": "^1.18.2" }, }

Run gatsby info --clipboard in your project directory and paste the output here. System: OS: Windows 10 CPU: (4) x64 Intel(R) Core(TM) i5-2500K CPU @ 3.30GHz Binaries: npm: 6.10.3 - C:\Program Files\nodejs\npm.CMD Languages: Python: 2.7.13 - /c/Python27/python Browsers: Edge: 44.17763.771.0 npmPackages: gatsby: ^2.15.29 => 2.15.29 gatsby-cli: ^2.8.1 => 2.8.1 gatsby-image: ^2.2.24 => 2.2.24 gatsby-plugin-manifest: ^2.2.20 => 2.2.20 gatsby-plugin-netlify-cms: ^4.1.22 => 4.1.22 gatsby-plugin-offline: ^2.2.10 => 2.2.10 gatsby-plugin-react-helmet: ^3.1.10 => 3.1.10 gatsby-plugin-sass: ^2.1.17 => 2.1.17 gatsby-plugin-sharp: ^2.2.28 => 2.2.28 gatsby-source-filesystem: ^2.1.29 => 2.1.29 gatsby-transformer-json: ^2.2.12 => 2.2.12 gatsby-transformer-remark: ^2.6.27 => 2.6.27 gatsby-transformer-sharp: ^2.2.20 => 2.2.20

aharris commented 5 years ago

@pieh I also saw that issue when I tried to install via yarn instead of npm for some reasons. I didn't look into it further and kept debugging with npm.

pieh commented 5 years ago

@aharris I tried both yarn and npm, and both results were similiar when pinning gatsby version (so I was getting pre 2.16 gatsby and post 2.8 gatsby-cli) - in both cases I was getting report._setStage is not a function, but wasn't able to reproduce error you reported

The above error occurred in the <ReduxStoreProvider> component:
    in ReduxStoreProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.

Which lead me to believe that there is more needed to get that problem than just mismatched package versions (that's why I asked for reproduction)

aharris commented 5 years ago

@pieh thanks for looking into this. Unfortunately I cannot share the code. I have it working for me by rolling back to 2.7.26. I just think changes to packages should be opt in, not forced behind the scenes. Using exact versions would prevent both of these error messages from coming out of no where forcing unnecessary debug time.

pieh commented 5 years ago

Yeah, that's valid point about pinning our own deps. Even if do that we can't fix already released package versions tho :S

Mupati commented 5 years ago

I'm quite new to gatsby and faced this same issue. The reason for the issue for me was that I had chosen yarn during the creation of the new project I was working on but later on I was using npm to install the packages. I deleted the new plugins I had installed with npm, deleted the package-lock.json file and reinstalled the plugins using yarn and the error was gone.

nc9 commented 5 years ago

If you're running multiple Gatsby instances in a mono/lerna repo make sure the versions are pinned across all of them consistently otherwise this and/or other errors will popup

TidyIQ commented 5 years ago

@nc9 Thanks, this was what was causing the issue for me. Different versions of Gatsby in different workspaces. Running yarn upgrade-interactive and upgrading all Gatsby packages to the latest version solved the issue.

gatsbot[bot] commented 4 years ago

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

github-actions[bot] commented 4 years ago

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community! 💪💜