vite-plugin-relay
Vite plugin for more convenient Relay experience.
What this plugin does for you:
- Generates artifacts on code changes
- Transform codes without Babel plugin
- Respects project's Relay config file
With only minimum configuration!
Installation
yarn add -D vite graphql vite-plugin-relay-lite
# Assumes the project already have relay-compiler and configuration
// vite.config.ts
import { type UserConfig } from 'vite';
import relay from 'vite-plugin-relay-lite';
const config: UserConfig = {
plugins: [
relay(),
],
};
export default config;
Customize Options
Customize Relay Config
Plugin will automatically load the Relay config file.
You can use custom config file path.
{
plugins: [
relay({
relayConfig: 'path/to/relay.js'
})
]
}
Or pass config object.
{
plugins: [
relay({
relayConfig: {
// ...relay config
}
})
]
}
ES Module Output
Plugin respects the eagerEsModules option in the Relay config, so the default output format is commonjs.
However, using CommonJS in Vite projects may require additional config to transpile, and it's not recommended to use. Consider to set eagerEsModules to true in your Relay config, or set module: 'esmodule' in plugin options as you require.
Relay Compiler Integration
Plugin automatically runs relay-compiler before transform, so it should be installed in the project.
Or you can set the codegen option to false to disable it.
{
plugins: [
relay({
codegen: false
})
]
}
Plugin respects the codegenCommand option in the Relay config, it uses relay-compiler if not set.
Acknowledgements
The compilation has ported from esbuild-plugin-relay, which was originally introduced from a gist by Samuel Cormier-Iijima
LICENSE
MIT
25 Nov 17, 2022
3 May 18, 2022
4 May 3, 2022
14 Jan 3, 2023
2 Apr 14, 2022
2 Jul 2, 2022
8 Nov 11, 2022
10 Aug 2, 2022
31 Dec 1, 2022
11 Nov 1, 2022