Skip to content
This repository was archived by the owner on Sep 27, 2023. It is now read-only.

Commit bdbc0e2

Browse files
authored
[README] Document need to output ES modules
Closes #40.
1 parent aec5c44 commit bdbc0e2

File tree

1 file changed

+28
-1
lines changed

1 file changed

+28
-1
lines changed

README.md

+28-1
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,10 @@ Add the package to your dev dependencies:
1515
yarn add relay-compiler-language-typescript --dev
1616
```
1717

18+
## Configuration
19+
20+
### relay-compiler
21+
1822
Then configure your `relay-compiler` script to use it, like so:
1923

2024
```json
@@ -25,7 +29,7 @@ Then configure your `relay-compiler` script to use it, like so:
2529
}
2630
```
2731

28-
This is going to store all artifacts in a single directory, which you also need to instruct the Babel plugin to use:
32+
This is going to store all artifacts in a single directory, which you also need to instruct `babel-plugin-relay` to use in your `.babelrc`:
2933

3034
```json
3135
{
@@ -35,6 +39,29 @@ This is going to store all artifacts in a single directory, which you also need
3539
}
3640
```
3741

42+
### TypeScript
43+
44+
Also be sure to configure the TypeScript compiler to transpile to `es2015` modules and leave transpilation to `commonjs` modules up to Babel with the following `tsconfig.json` settings:
45+
46+
```json
47+
{
48+
"compilerOptions": {
49+
"target": "es2015",
50+
"module": "es2015"
51+
}
52+
}
53+
```
54+
55+
The reason for this is that `tsc` would otherwise generate code where the imported `graphql` function is being namespaced (`react_relay_1` in this example):
56+
57+
```js
58+
react_relay_1.createFragmentContainer(MyComponent, react_relay_1.graphql `
59+
...
60+
`);
61+
```
62+
63+
…and this makes it impossible for `babel-plugin-relay` to find the locations where the `graphql` function is being used.
64+
3865
## Examples
3966

4067
You can find a copy of the Relay

0 commit comments

Comments
 (0)