unplugin-relay

Unlugin Relay

Install

npm i unplugin-relay

// 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.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.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.config.js
module.exports = {
  /* ... */
  plugins: [
    require("unplugin-relay/webpack")({
      language: relayConfig.language,
      eagerEsModules: relayConfig.eagerEsModules,
      artifactDirectory: path.resolve(relayConfig.artifactDirectory),
    }),
  ],
};

// 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.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.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),
    }),
  ],
});