Registry / web-framework / vite-plugin-graphql

vite-plugin-graphql

library0.1.0jsnpmunverified

A Vite plugin (v0.1.0) that allows importing .gql and .graphql files as strings, similar to graphql-tag/loader for webpack. It is a lightweight wrapper using the Vite plugin API, requiring Vite 1.x beta or stable. Minimal configuration needed — just add it to plugins. No built-in type support or caching options; designed for small to medium projects. Release cadence: sporadic, last updated in 2021.

web-framework

npm install vite-plugin-graphql

github ↗package ↗

INSTALL

IMPORT

SIG · VITE-PLUGIN-GRAPHQ

vite-plugin-graphql

web-frameworkjavascriptv0.1.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.

graphqlPlugin

✓ import graphqlPlugin from 'vite-plugin-graphql'

✗ const graphqlPlugin = require('vite-plugin-graphql')

ESM default import is preferred, but CommonJS require works if using Node < 13 or CJS config.

graphqlPlugin

✓ const graphqlPlugin = require('vite-plugin-graphql')

✗ import { graphqlPlugin } from 'vite-plugin-graphql'

Named import is not supported; the plugin must be imported as default.

VitePluginGraphQL

✓ import VitePluginGraphQL from 'vite-plugin-graphql'

✗ import VitePluginGraphQL from 'vite-plugin-graphql/default'

No named export; default export only. TypeScript users may need to declare module types.

Shows how to add the plugin to Vite config and use it to import .graphql or .gql files as strings.

// vite.config.js (or vite.config.ts) import { defineConfig } from 'vite'; import graphqlPlugin from 'vite-plugin-graphql'; export default defineConfig({ plugins: [graphqlPlugin()], }); // Then in any .js/.ts file: import query from './schema.graphql'; console.log(query); // 'query { ... }' string // Or .gql files: import mutation from './mutation.gql';

Debug

Known issues

deprecatedPackage is unmaintained since 2021 and relies on Vite 1.x plugin API, which is incompatible with Vite 2+.

fix

Migrate to a maintained alternative like @rollup/plugin-graphql or graphql-vite-plugin.

affects: >=0.1.0

breakingRequires Vite ^1.0.0; will not work with Vite 2.x or later due to API changes.

fix

Do not use with Vite 2+; find a compatible plugin or upgrade approach.

affects: >=0.1.0

gotchaThe plugin does not parse .graphql files; it only returns the raw file content as a string. No GraphQL tags or AST processing.

fix

If you need parsed documents, use graphql-tag together with this plugin, or switch to a more feature-rich loader.

affects: >=0.1.0

Errors

Common errors & fixes

Error: The plugin 'vite-plugin-graphql' is incompatible with this version of Vite.

Trying to use with Vite 2+ where plugin API changed (should be function instead of object).

fix

Upgrade to a Vite 2+ compatible GraphQL plugin or downgrade Vite to 1.x.

Failed to resolve import 'vite-plugin-graphql' from 'vite.config.js'

Package not installed or typo in import name.

fix

Run 'npm install vite-plugin-graphql' and ensure the import matches the package name exactly.

Upgrade

Version history

0.1.0latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

7 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/foisonocean/vite-plugin-graphql ↗

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