Not working with CreateReactApp about relay-compiler-language-typescript HOT 15 CLOSED

@spiegela The only issue I bumped into using CRA with relay-compiler-language-typescript was setting the location of the artifacts directory. With the change I made, all I've had to do is add the following to my package.json:

"babelMacros": {
    "relay": {
      "artifactDirectory": "./src/__generated__"
    }
  }

(you can also configure this in other places according to your taste – more detail on that in the PR).

from relay-compiler-language-typescript.

can we close this?

check a working example here https://github.com/sibelius/create-react-app-relay-modern

from relay-compiler-language-typescript.

@spiegela by the way, even though my changes have been merged, there’s not been a release including them yet!

from relay-compiler-language-typescript.

If I exclude the artifacts in my .tsconfig, it works, but not sure if that's intended.

"exclude": [
    "**/__generated__"
  ]

Sorry, new to typescript, let me know if I'm doing something stupid.

from relay-compiler-language-typescript.

I think #83 might solve the actual problem you're running into.

Besides that, here's a few notes:

Not using the single artifact directory should work just fine - but this will disable typechecking that the relay data you pass between components is actually correct (ie. you can now pass data to a component that has not had its data fetched). I understand the issue you run into here, but aside from working with the CRA team I'm not sure what we can do here.

Excluding the __generated__ directories from the TS compilation I would expect would stop the typechecker from working with those files. Can you import the files and get autocompletion in your components with this setup?

from relay-compiler-language-typescript.

I don’t have personal experience with CRA, but iirc there’s a project called babel-macros that would allow Babel configuration with CRA. (I don’t have fine to dive into that right now, but would welcome any patches necessary to make it work with that setup.)

from relay-compiler-language-typescript.

@kastermester You're correct that excluding the __generated__ directory broke autocompletion in my editor. I've reverted that change.

It looks like #83 hasn't been released yet, but I was able to get it working in the meantime by setting "noImplicitAny": false in .tsconfig. I recognize that this lowers the type-safety bar a bit.

@alloy Yes, we're using babel-plugin-relay/macro. It sounds like the only change needed is to point it at a different artifact directory?

from relay-compiler-language-typescript.

Unsure. What I meant more is that if we can support CRA through Babel-macros (I don’t even know what they do exactly) then that would be great.

from relay-compiler-language-typescript.

Bumped into this problem myself today. I've opened a PR that allows you to configure babel-plugin-relay options through the macro, but it's a change that has to be made on the plugin itself: facebook/relay#2646

from relay-compiler-language-typescript.

@sgwilym It looks like your change to configure babel-plugin-relay/macro got merged. Do you have an example of this with relay-compiler-language-typescript? I'm also running into issues with a CRA-2 app.

from relay-compiler-language-typescript.

You’re not actually using these settings in that example app, right? In any case, yeah feels like we can close this by now 👍

from relay-compiler-language-typescript.

Well, I checked the sample app, and it doesn't seem to relate to this issue. I know I came in late on this issue, but I'm experiencing the same result. However, this doesn't seem to be an issue with relay-compiler-language, rather I haven't gotten babel-plugin-relay/macro to recognize my artifactDirectory setting, yet-- I've tried various methods described in the links above.

I'll take this up with babel-plugin-relay, but out of curiosity is there a hard dependency for relay-compiler-language on a specific artifactDirectory for the generated ts files? My issue would also be solved if the default behavior of babel-plugin-relay/macro matched the default behavior of relay-compiler: placing the generated files in __generated__ directories in the same directory as the source file.

from relay-compiler-language-typescript.

@spiegela Thanks for the update! @sibelius Any chance you could update your example to use these macro settings?

As for the other question, please see this section of the type emission part of the Relay docs: https://facebook.github.io/relay/docs/en/type-emission.html#single-artifact-directory

from relay-compiler-language-typescript.

🤦‍♂️ Of course! I don't know why I didn't check to see if it was in a release. I'll take a look and see if I can test with babel-plugin-relay from master.

from relay-compiler-language-typescript.

Fix graphql errors with this
DefinitelyTyped/DefinitelyTyped#35707

from relay-compiler-language-typescript.