vite-plugin-relay-custom
v1.0.7
Published
A vite plugin for relay
Downloads
8
Maintainers
Readme
Add relay support to your Vite projects.
Created with the help of @Brendonovich and thanks to @kesne for adding pnpm support.
Usage
Add vite-plugin-relay
and relay
to your project.
yarn add react-relay relay-runtime
yarn add -D relay-compiler relay-config vite-plugin-relay
Next setup NPM scripts in the package.json
. One is required for Vite and the other for the Relay Compiler
"scripts": {
"dev": "vite",
"relay": "relay-compiler"
},
Next setup relay.config.js
more information about this can be found in the official relay docs.
Finally add vite-plugin-relay
to your Vite configuration (vite.config.ts
).
import { defineConfig } from "vite";
import relay from "vite-plugin-relay";
export default defineConfig({
plugins: [..., relay],
});
Now your project is setup to use Relay with Vite!
Common Issues
Uncaught ReferenceError: global is not defined
If 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:
<script>
let global = globalThis;
</script>
Server Side Rendering
If 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
file.
if (typeof (window as any).global === 'undefined') {
(window as any).global = globalThis;
}