npm i unplugin-relayVite
// vite.config.ts
import relay from "unplugin-relay/vite";
import relayConfig from "./relay.config.json" with { type: "json" };
import path from "path";
export default defineConfig({
plugins: [
relay({
language: relayConfig.language,
eagerEsModules: relayConfig.eagerEsModules,
artifactDirectory: path.resolve(relayConfig.artifactDirectory),
}),
],
});Example: playground/
Rollup
// rollup.config.js
import relay from "unplugin-relay/rollup";
import relayConfig from "./relay.config.json" with { type: "json" };
import path from "path";
export default {
plugins: [
relay({
language: relayConfig.language,
eagerEsModules: relayConfig.eagerEsModules,
artifactDirectory: path.resolve(relayConfig.artifactDirectory),
}),
],
};Rolldown
// rolldown.config.js
import relay from "unplugin-relay/rolldown";
import relayConfig from "./relay.config.json" with { type: "json" };
import path from "path";
export default {
plugins: [
relay({
language: relayConfig.language,
eagerEsModules: relayConfig.eagerEsModules,
artifactDirectory: path.resolve(relayConfig.artifactDirectory),
}),
],
};Webpack
// webpack.config.js
module.exports = {
/* ... */
plugins: [
require("unplugin-relay/webpack")({
language: relayConfig.language,
eagerEsModules: relayConfig.eagerEsModules,
artifactDirectory: path.resolve(relayConfig.artifactDirectory),
}),
],
};Nuxt
// nuxt.config.js
import relayConfig from "./relay.config.json" with { type: "json" };
import path from "path";
export default defineNuxtConfig({
modules: [
[
"unplugin-relay/nuxt",
{
language: relayConfig.language,
eagerEsModules: relayConfig.eagerEsModules,
artifactDirectory: path.resolve(relayConfig.artifactDirectory),
},
],
],
});This module works for both Nuxt 2 and Nuxt Vite
Vue CLI
// vue.config.js
const relayConfig = require("./relay.config.json");
const path = require("path");
module.exports = {
configureWebpack: {
plugins: [
require("unplugin-relay/webpack")({
language: relayConfig.language,
eagerEsModules: relayConfig.eagerEsModules,
artifactDirectory: path.resolve(relayConfig.artifactDirectory),
}),
],
},
};esbuild
// esbuild.config.js
import { build } from "esbuild";
import relay from "unplugin-relay/esbuild";
import relayConfig from "./relay.config.json" with { type: "json" };
import path from "path";
build({
plugins: [
relay({
language: relayConfig.language,
eagerEsModules: relayConfig.eagerEsModules,
artifactDirectory: path.resolve(relayConfig.artifactDirectory),
}),
],
});