{"id":13624516,"url":"https://github.com/relay-tools/relay-compiler-language-typescript","last_synced_at":"2025-04-16T00:32:35.927Z","repository":{"id":28345028,"uuid":"116306642","full_name":"relay-tools/relay-compiler-language-typescript","owner":"relay-tools","description":"⛔️ Obsolete - A language plugin for Relay that adds TypeScript support, including emitting type definitions.","archived":true,"fork":false,"pushed_at":"2023-09-27T09:18:27.000Z","size":4094,"stargazers_count":241,"open_issues_count":44,"forks_count":69,"subscribers_count":8,"default_branch":"master","last_synced_at":"2024-04-27T23:43:37.138Z","etag":null,"topics":["language-plugin","obsolete","relay","relay-compiler"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/relay-tools.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2018-01-04T20:54:38.000Z","updated_at":"2023-12-22T14:47:55.000Z","dependencies_parsed_at":"2024-01-07T21:07:03.191Z","dependency_job_id":"863e5aa5-2263-4980-ab41-56b3c5c54760","html_url":"https://github.com/relay-tools/relay-compiler-language-typescript","commit_stats":{"total_commits":708,"total_committers":49,"mean_commits":"14.448979591836734","dds":0.6002824858757062,"last_synced_commit":"b05de7727f4d63f93c7b345cc75a70d4313962c3"},"previous_names":[],"tags_count":46,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/relay-tools%2Frelay-compiler-language-typescript","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/relay-tools%2Frelay-compiler-language-typescript/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/relay-tools%2Frelay-compiler-language-typescript/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/relay-tools%2Frelay-compiler-language-typescript/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/relay-tools","download_url":"https://codeload.github.com/relay-tools/relay-compiler-language-typescript/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248613234,"owners_count":21133472,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["language-plugin","obsolete","relay","relay-compiler"],"created_at":"2024-08-01T21:01:43.393Z","updated_at":"2025-04-16T00:32:35.431Z","avatar_url":"https://github.com/relay-tools.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"# Obsolete\n\nThis repository is obsolete as [relay@13](https://github.com/facebook/relay/releases/tag/v13.0.0) now supports TypeScript directly.\n\n# relay-compiler-language-typescript\n\n[![Build Status](https://travis-ci.org/relay-tools/relay-compiler-language-typescript.svg?branch=master)](https://travis-ci.org/relay-tools/relay-compiler-language-typescript)\n\nA language plugin for [Relay](https://facebook.github.io/relay/) that adds\nTypeScript support, including emitting type definitions.\n\n## Installation\n\nAdd the package to your dev dependencies:\n\n```\nyarn add graphql relay-compiler --dev\nyarn add typescript relay-compiler-language-typescript --dev\n```\n\n**Note:** Starting with version 15.0.0 relay-compiler-language-typescript requires a minimum TypeScript version of 4.5.0 being installed in your project.\n\n## Configuration\n\n### relay-compiler\n\nThen configure your `relay-compiler` script to use it, like so:\n\n```json\n{\n  \"scripts\": {\n    \"relay\":\n      \"relay-compiler --src ./src --schema data/schema.graphql --language typescript --artifactDirectory ./src/__generated__\"\n  }\n}\n```\n\nThis is going to store all artifacts in a single directory, which you also need\nto instruct `babel-plugin-relay` to use in your `.babelrc`:\n\n```json\n{\n  \"plugins\": [[\"relay\", { \"artifactDirectory\": \"./src/__generated__\" }]]\n}\n```\n\n### TypeScript\n\nAlso be sure to configure the TypeScript compiler to transpile to `ES2015`\nmodules (or higher) and leave transpilation to `CommonJS` modules (if required)\nup to Babel with the following `tsconfig.json` settings:\n\n```json5\n{\n  \"compilerOptions\": {\n    \"module\": \"ES2015\", // ES2015 or higher\n    \"target\": \"ES2020\"  // best use the highest target setting compatible with your Babel setup\n  }\n}\n```\n\nThe reason for this is that `tsc` would otherwise generate code where the\nimported `graphql` function is being namespaced (`react_relay_1` in this\nexample):\n\n```js\nreact_relay_1.createFragmentContainer(\n  MyComponent,\n  react_relay_1.graphql`\n  ...\n`\n);\n```\n\n… which makes it impossible for `babel-plugin-relay` to find the locations\nwhere the `graphql` function is being used.\n\n*The generated code uses ES2015 module syntax if `module` is set to ES2015 or\nhigher in your `tsconfig.json`. Note that the `eagerESModules` option from\n`relay-compiler` has no effect on the generated code if `module` is ES2015 or\nhigher.*\n\n#### Custom Headers\n\nIf you need to add a custom header to generated files, perhaps for a custom linter\nor to get boilerplate license code in, that can be passed in also in compilerOptions\nas `banner`:\n\n```json\n{\n  \"compilerOptions\": {\n    \"banner\": \"/* \u0026copy; 2021 Example.org - @generated code */\"\n  }\n}\n```\n\n## Problems\n\n### React Hot Loader\n\nReact Hot Loader is known to not always work well with generated code such as\nour typing artifacts, which will lead to loading modules _with_ TypeScript types\ninto the browser and break. As a maintainer of RHL\n[pointed out](https://github.com/gaearon/react-hot-loader/issues/1032) in a\nsimilar issue:\n\n\u003e The problem - hot reloading is not \"complete\"\n\nSo\n[until RHL will be made “complete”](https://github.com/gaearon/react-hot-loader/issues/1024)\nthis project can’t gurantee to always work well with it, nor is it our control\nto do anything about that.\n\n## Also see\n\n* You can find a copy of the Relay\n  [example TODO app](https://github.com/relay-tools/relay-compiler-language-typescript/tree/master/example)\n  inside this repository or you can take a look at the\n  [Artsy React Native app](https://github.com/artsy/eigen).\n* There are Relay tslint rules available\n  [here](https://github.com/relay-tools/tslint-plugin-relay).\n\n## License\n\nThis package is available under the MIT license. See the included LICENSE file\nfor details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frelay-tools%2Frelay-compiler-language-typescript","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frelay-tools%2Frelay-compiler-language-typescript","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frelay-tools%2Frelay-compiler-language-typescript/lists"}