mobxjs / mst-gql

Bindings for mobx-state-tree and GraphQL
MIT License
680 stars 81 forks source link

Invalid Version: undefined when running 3-twitter-clone example #311

Open alchemistgo87 opened 3 years ago

alchemistgo87 commented 3 years ago

Getting this error when running the provided twitter-clone example:

Screenshot 2021-03-05 at 12 46 11 PM

node: 14.16.0 yarn: 1.22.10 OS: MacOS Big Sur 11.2.2

Instructions followed: https://github.com/mobxjs/mst-gql/blob/main/examples/3-twitter-clone/README.md

[INFO] 12:45:29 ts-node-dev ver. 1.1.6 (using ts-node ver. 9.1.1, typescript ver. 4.2.3)
Server running at http://localhost:3000 
🚨  /Users/.../mst-gql/examples/3-twitter-clone/src/app/index.tsx: Invalid Version: undefined
    at new SemVer (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/@babel/preset-env/node_modules/semver/semver.js:314:11)
    at compare (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/@babel/preset-env/node_modules/semver/semver.js:647:10)
    at lt (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/@babel/preset-env/node_modules/semver/semver.js:688:10)
    at /Users/.../mst-gql/examples/3-twitter-clone/node_modules/@babel/preset-env/lib/index.js:276:22
    at Object.default (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/@babel/helper-plugin-utils/lib/index.js:22:12)
    at getEnvPlugins (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/parcel/src/transforms/babel/env.js:62:34)
    at getEnvConfig (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/parcel/src/transforms/babel/env.js:12:25)
    at async getBabelConfig (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/parcel/src/transforms/babel/config.js:32:19)
    at async babelTransform (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/parcel/src/transforms/babel/transform.js:6:16)
    at async JSAsset.pretransform (/Users/.../mst-gql/examples/3-twitter-clone/node_modules/parcel/src/assets/JSAsset.js:83:5)
Type "SearchResult" is missing a "__resolveType" resolver. Pass false into "resolverValidationOptions.requireResolversForResolveType" to disable this warning.
🚀 Server ready at http://localhost:4000/graphql
🚀 Subscriptions ready at ws://localhost:4000/graphql
emckay commented 3 years ago

To fix this, pin parcel to 1.12.3 in the example's package.json:

    "parcel": "1.12.3",

super annoying issue

alchemistgo87 commented 3 years ago

Thank you for the help @emckay. It worked. But now the browser is showing blank page and in the console getting this error:

Uncaught TypeError: Class constructor QueryBuilder cannot be invoked without 'new'
    at new UserModelSelector (UserModel.base.ts:29)
    at selectFromUser (UserModel.base.ts:35)
    at Object.parcelRequire.../src/app/models/UserModel.base.ts.mobx-state-tree (UserModel.base.ts:38)
    at newRequire (app.d221c077.js:47)
    at localRequire (app.d221c077.js:53)
    at Object.parcelRequire.../src/app/models/UserModel.ts../UserModel.base (UserModel.ts:2)
    at newRequire (app.d221c077.js:47)
    at localRequire (app.d221c077.js:53)
    at Object.parcelRequire.../src/app/models/RootStore.base.ts.mobx-state-tree (RootStore.base.ts:8)
    at newRequire (app.d221c077.js:47)
emckay commented 3 years ago

I fixed that one by changing the target from es5 to es6 in the example's tsconfig.json.

To fix the next error you will run into, run yarn add mobx mobx-state-tree mobx-react react react-dom mst-gql graphql-request in the example directory.

I ran into all these issues yesterday -- good luck!

alchemistgo87 commented 3 years ago

That's correct, it worked after following the above 2 steps. Thank you so much @emckay.

Benz19 commented 1 year ago

Hi @alchemistgo87 Im trying to help @jesse-savary organize all the open issues... are you still having problems with this issue? looks like it was solved?