{"id":13624391,"url":"https://github.com/oscartbeaumont/vite-plugin-relay","last_synced_at":"2025-04-07T10:23:06.396Z","repository":{"id":37816618,"uuid":"378492424","full_name":"oscartbeaumont/vite-plugin-relay","owner":"oscartbeaumont","description":"A vite plugin for Relay","archived":false,"fork":false,"pushed_at":"2024-03-05T12:00:32.000Z","size":699,"stargazers_count":76,"open_issues_count":14,"forks_count":14,"subscribers_count":4,"default_branch":"main","last_synced_at":"2024-05-01T16:33:48.544Z","etag":null,"topics":["graphql","graphql-relay","relay","typescript","vite","vite-plugin","vite-plugin-relay"],"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/oscartbeaumont.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["oscartbeaumont"],"custom":["https://paypal.me/oscartbeaumont"]}},"created_at":"2021-06-19T19:42:53.000Z","updated_at":"2024-06-13T02:27:13.067Z","dependencies_parsed_at":"2023-12-10T08:24:02.160Z","dependency_job_id":"730e9ff5-5064-4748-853c-d094f90cad09","html_url":"https://github.com/oscartbeaumont/vite-plugin-relay","commit_stats":{"total_commits":140,"total_committers":7,"mean_commits":20.0,"dds":0.4214285714285714,"last_synced_commit":"fed367c7ae5483e3e0431f3bedfa857970edaef3"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscartbeaumont%2Fvite-plugin-relay","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscartbeaumont%2Fvite-plugin-relay/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscartbeaumont%2Fvite-plugin-relay/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oscartbeaumont%2Fvite-plugin-relay/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oscartbeaumont","download_url":"https://codeload.github.com/oscartbeaumont/vite-plugin-relay/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247632502,"owners_count":20970173,"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":["graphql","graphql-relay","relay","typescript","vite","vite-plugin","vite-plugin-relay"],"created_at":"2024-08-01T21:01:42.035Z","updated_at":"2025-04-07T10:23:06.373Z","avatar_url":"https://github.com/oscartbeaumont.png","language":"TypeScript","funding_links":["https://github.com/sponsors/oscartbeaumont","https://paypal.me/oscartbeaumont"],"categories":["TypeScript"],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003eVite Plugin Relay\u003c/h1\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \n  [![NPM](https://img.shields.io/npm/v/vite-plugin-relay)](https://www.npmjs.com/package/vite-plugin-relay)\n  [![CI workflow](https://github.com/oscartbeaumont/vite-plugin-relay/actions/workflows/ci.yml/badge.svg)](https://github.com/oscartbeaumont/vite-plugin-relay/actions)\n\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n    Add relay support to your \u003ca href=\"https://vitejs.dev\"\u003eVite\u003c/a\u003e projects.\n\u003c/div\u003e\n\n\u003cbr /\u003e\n\n❤️ Special thanks to:\n\n- [@Brendonovich](https://github.com/Brendonovich) for general help\n- [@kesne](https://github.com/kesne) for adding [pnpm](https://pnpm.io) support\n- [@tobias-tengler](https://github.com/tobias-tengler) for adding Vite 3 support\n\nI **do not** actively use this project anymore, however, it will still receive periodic updates.\n\n## Usage\n\nFollow Relay's guide on [how to add Relay to your project](https://relay.dev/docs/getting-started/installation-and-setup/).\n\n\u003e ⚠️ Note: Install `babel-plugin-relay` (\u003e= 13.0.1) as devDependencies as instructed, but skip its configuration. `vite-plugin-relay` will invoke the babel plugin for you!\n\nAdd `vite-plugin-relay` to your `devDependencies`:\n\n```bash\nyarn add vite-plugin-relay -D\n```\n\nAdd `vite-plugin-relay` to your Vite configuration (`vite.config.ts` or `vite.config.js`):\n\n```typescript\nimport { defineConfig } from \"vite\";\nimport relay from \"vite-plugin-relay\";\n\nexport default defineConfig({\n  plugins: [..., relay],\n});\n```\n\nConfigure `relay-compiler` to output artifacts with `export default` syntax, by setting `eagerEsModules` to `true`:\n\n```json\n{\n  \"relay\": {\n    \"src\": \"./src\",\n    \"schema\": \"./src/schema.graphql\",\n    \"language\": \"typescript\",\n    \"eagerEsModules\": true,\n    \"exclude\": [\"**/node_modules/**\", \"**/__mocks__/**\", \"**/__generated__/**\"]\n  }\n}\n```\n\nNow your project is setup to use Relay with Vite!\n\n## How this plugin works\n\nUnder the hood we are invoking the official `babel-plugin-relay`. This ensures that our plugin and `babel-plugin-relay` do not get out of sync over time and also reduces the maintainance costs of this project.\n\nSince v13 `babel-plugin-relay` automatically gets its configuration from either the `package.json`, `relay.config.js` or `relay.config.json`, so our plugin also doesn't have to expose a configuration API.\n\n## Common Issues\n\n### `Uncaught ReferenceError: global is not defined`\n\nIf you experience this error in your browser console when using the plugin add the following define to your `index.html` file before importing your Javascript:\n\n```html\n\u003cscript\u003e\n  let global = globalThis;\n\u003c/script\u003e\n```\n\n## Server Side Rendering\n\nIf you are planning to use this plugin with server side rendering you may need to define `window`. You could do this by putting the following snippet in your [`entry-server.js`](https://vitejs.dev/guide/ssr.html#source-structure) file.\n\n```js\nif (typeof (window as any).global === 'undefined') {\n  (window as any).global = globalThis;\n}\n```\n\n## Contributing\n\n```\ngit clone ...\npnpm i\n# If you have never run Playwright run `npx playwright install` to setup your system.\ncd examples/vite-3\npnpm dev\n\npnpm format # Do this before doing a commit\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foscartbeaumont%2Fvite-plugin-relay","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foscartbeaumont%2Fvite-plugin-relay","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foscartbeaumont%2Fvite-plugin-relay/lists"}