facebook / facebook/relay

`babel-plugin-relay` bug: `eagerEsModules: true` only works with single-project Relay configs.

Open
#4,909 4 comments 3 reactions 0 assignees View on GitHub
shared with relay team
Dominant language
Rust
Stars
19k
Forks
1.9k
PR merge metrics
No merged PRs in 30d

Description

## Summary of the bug

When `"eagerEsModules": true` is set in a multi-project Relay config, `babel-plugin-relay` transforms `graphql` tagged templates into require calls, like this:

```js
var _MeQuery;
var MeQuery =
_MeQuery !== void 0
? _MeQuery
: ((_MeQuery = require("./__generated__/MeQuery.graphql")),
_MeQuery.hash &&
_MeQuery.hash !== "bce9f1cc4614c3f306814d78c53b009b" &&
console.error(
"The definition of 'MeQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."
),
_MeQuery);
```

## Expected behavior

Just like it does with a single-project Relay config, `babel-plugin-relay` should transform `graphql` tagged templates into import declarations when `"eagerEsModules": true` is set, like this:

```js
import _MeQuery from "../__generated__/MeQuery.graphql";
var MeQuery =
(_MeQuery.hash &&
_MeQuery.hash !== "bce9f1cc4614c3f306814d78c53b009b" &&
console.error(
"The definition of 'MeQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."
),
_MeQuery);
```

## Reproducing the bug

I created a [reduced test case](https://github.com/tomfuhrer/babel-plugin-relay-eagerEsModules-bug) to demonstrate this behavior. If you want to reproduce the bug yourself, you can clone the repo, run the build commands, and compare the output. The repo also includes the dist files (one each for single and multi-project configs), so if you want to take my word for It, you can just compare the outputs on GitHub. More detail in the README.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.