Registry / web-framework / vite-plugin-relay-lite

vite-plugin-relay-lite

library0.12.0jsnpmunverified

A Vite plugin that provides a more convenient Relay experience by automatically transforming GraphQL template literals and integrating with the Relay compiler. Current stable version is 0.12.0, released with ESM defaults to match Relay Compiler v19 behavior. Supports Vite 2–7 and GraphQL 15/16. Key differentiators: lightweight, no need for .babelrc or relay-plugin, supports multiple config file formats (.config/relay.{js,json,yml}), and offers experimental features like automatic graphql tag imports. Actively maintained with frequent updates.

web-framework

npm install vite-plugin-relay-lite

github ↗package ↗

INSTALL

IMPORT

SIG · VITE-PLUGIN-RELAY-

vite-plugin-relay-lite

web-frameworkjavascriptv0.12.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

default

✓ import relay from 'vite-plugin-relay-lite'

✗ import { relay } from 'vite-plugin-relay-lite'

Default export is the plugin factory function. Named export 'relay' does not exist.

PluginOptions

✓ import type { PluginOptions } from 'vite-plugin-relay-lite'

✗ import { PluginOptions } from 'vite-plugin-relay-lite'

PluginOptions is a TypeScript type – use 'import type' for runtime safety. Available since v0.8.0.

Vite Plugin Relay

✓ import relay from 'vite-plugin-relay-lite' export default defineConfig({ plugins: [relay()] })

✗ const relay = require('vite-plugin-relay-lite') // CJS not supported in v0.12+; use ESM

Since v0.12.0, the package is ESM-only. Use import syntax, not require().

Shows how to add vite-plugin-relay-lite to a Vite config with optional settings like custom config path and auto-import of graphql tag.

import relay from 'vite-plugin-relay-lite' import { defineConfig } from 'vite' export default defineConfig({ plugins: [ relay({ // Optional: specify custom Relay config path (default: relay.config.js) config: './.config/relay.json', // Optional: enable experimental auto-import of graphql tag (since v0.8.0) autoImportGraphQLTag: true, }) ] })

Debug

Known issues

breakingv0.12.0 changed default to ES modules, breaking CJS require() imports.

fix

Use ESM import syntax (import relay from 'vite-plugin-relay-lite') instead of require().

affects: >=0.12.0

deprecatedThe 'compact' option was deprecated in v0.10.0 and removed in v0.11.0.

fix

Remove the 'compact' option from plugin config. Use default behavior.

affects: >=0.11.0

gotchaMultiple query/fragment definitions in a single graphql tag are banned since v0.10.0.

fix

Split multiple definitions into separate graphql tagged templates.

affects: >=0.10.0

breakingv0.9.0 dropped support for Node < 18.

fix

Upgrade Node.js to version 18 or higher.

affects: >=0.9.0

gotchaWhen using autoImportGraphQLTag (v0.8.0+), ensure graphql is not manually imported – it will be injected automatically.

fix

Remove explicit import of graphql from 'relay-runtime' if autoImportGraphQLTag is true.

affects: >=0.8.0

Errors

Common errors & fixes

The 'graphql' tag from 'relay-runtime' is not auto-imported after enabling autoImportGraphQLTag.

The option must be set at plugin config, and the tag is only added to files that use graphql template literals.

fix

Ensure autoImportGraphQLTag: true is set in plugin options and that the file contains a graphql`...` expression.

Error: Cannot find module 'vite-plugin-relay-lite' at ...

Package is ESM-only since v0.12.0, but you are using require() or a non-ESM environment.

fix

Switch to ESM: use import syntax in .mjs files or set "type": "module" in package.json.

TypeError: relay is not a function at ...

Incorrect import: using { relay } instead of default import, or using require() which now returns ESM default.

fix

Use default import: import relay from 'vite-plugin-relay-lite'.

Relay configuration file not found: relay.config.js

The plugin expects a relay config file in the project root (default name relay.config.js).

fix

Create a relay.config.js file or specify a custom config path via the 'config' option.

Upgrade

Version history

0.12.0latest on npm

Audit

Dependencies

graphqlrequiredPeer dependency for GraphQL types and parsing

viterequiredPeer dependency – runs as a Vite plugin

Agent activity

9 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/cometkim/vite-plugin-relay-lite ↗

packagehttps://www.npmjs.com/package/vite-plugin-relay-lite ↗