Relay: Fresh installation of Relay 7.1 (experimental/hooks)

[zaydek-old]

_This is advice, not a real issue._

I read the new Relay docs:

Step by Step
A Guided Tour

I wanted to drive Relay 7.1 experimental, the one with hooks, but ran into a few problems along the way. I got it working, but I figured I’d post the two files that help distinct what works because it took me to two tries:

My package.json looks like this:

{
  "name": "relay",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^0.0.0-experimental-b53ea6ca0",
    "react-dom": "^0.0.0-experimental-b53ea6ca0",
    "react-relay": "^0.0.0-experimental-a1a40b68",
    "react-scripts": "3.2.0",
    "relay-runtime": "7.0.0"
  },
  "scripts": {
    "start": "yarn run relay && react-scripts start",
    "build": "yarn run relay && react-scripts build",
    "relay": "yarn run relay-compiler --schema schema.graphql --src ./src/ --watchman false $@",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "babel-plugin-relay": "^7.1.0",
    "graphql": "^14.5.8",
    "relay-compiler": "^7.1.0"
  }
}

And I created a .babelrc files that looks like this:

{
  "plugins": [
    "relay"
  ]
}

Only after installing all of those dependencies and setting up the .babelrc did my project start working. It’s worth mentioning that in my project’s dependencies I needed to specify "relay-runtime": "7.0.0" — 7.1.0; the default ^7.1.0 emitted an error I couldn’t resolve.

I hope this helps, and sorry if this is the wrong place to post this, just want to help.

[sibelius]

What error?

[seanchas]

Looks like I have the same error when using react-relay@experimental with [email protected]

Invariant Violation: preloadQuery(): Expected a RelayModernEnvironment

[sibelius]

You need to install all version with @experimental

[zaydek-old]

@seanchas That’s the error I hit too. It looks like this starter kit is designed to help get experimenters up and running: https://github.com/relayjs/relay-examples/tree/master/issue-tracker.

I also recommend try experimenting in a separate project; it can be too stressful to migrate a working project if you’re not familiar with all the potential warnings/errors.

[lukaspili]

@sibelius what other package requires an experimental version? Could not find an experimental version for relay-runtime.

  "dependencies": {
    "react": "^0.0.0-experimental-b53ea6ca0",
    "react-dom": "^0.0.0-experimental-b53ea6ca0",
    "react-relay": "^0.0.0-experimental-a1a40b68",
    "react-scripts": "3.2.0",
    "relay-runtime": "7.0.0"
  },

[sibelius]

remove "relay-runtime": "7.0.0"

[juliadmytrenko]

Looks like I have the same error when using react-relay@experimental with [email protected]

Invariant Violation: preloadQuery(): Expected a RelayModernEnvironment

package.json:
"react-relay": "^0.0.0-experimental-a1a40b68", "relay-runtime": "7.0.0"

this fixed the error for me

[duxtinto]

Invariant Violation: preloadQuery(): Expected a RelayModernEnvironment

I was getting this same error after installing "react-relay": "^0.0.0-experimental-5f1cb628"

after changing the dependencies on my package.json:
"react-relay": "^0.0.0-experimental-5f1cb628", "relay-runtime": "8.0.0"

the error was fixed