{"id":22682,"library":"vite-plugin-graphql","title":"vite-plugin-graphql","description":"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.","status":"deprecated","version":"0.1.0","language":"javascript","source_language":"en","source_url":"ssh://git@github.com/foisonocean/vite-plugin-graphql","tags":["javascript","vite","graphql"],"install":[{"cmd":"npm install vite-plugin-graphql","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-graphql","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-graphql","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"ESM default import is preferred, but CommonJS require works if using Node < 13 or CJS config.","wrong":"const graphqlPlugin = require('vite-plugin-graphql')","symbol":"graphqlPlugin","correct":"import graphqlPlugin from 'vite-plugin-graphql'"},{"note":"Named import is not supported; the plugin must be imported as default.","wrong":"import { graphqlPlugin } from 'vite-plugin-graphql'","symbol":"graphqlPlugin","correct":"const graphqlPlugin = require('vite-plugin-graphql')"},{"note":"No named export; default export only. TypeScript users may need to declare module types.","wrong":"import VitePluginGraphQL from 'vite-plugin-graphql/default'","symbol":"VitePluginGraphQL","correct":"import VitePluginGraphQL from 'vite-plugin-graphql'"}],"quickstart":{"code":"// vite.config.js (or vite.config.ts)\nimport { defineConfig } from 'vite';\nimport graphqlPlugin from 'vite-plugin-graphql';\n\nexport default defineConfig({\n  plugins: [graphqlPlugin()],\n});\n\n// Then in any .js/.ts file:\nimport query from './schema.graphql';\nconsole.log(query); // 'query { ... }' string\n// Or .gql files:\nimport mutation from './mutation.gql';","lang":"javascript","description":"Shows how to add the plugin to Vite config and use it to import .graphql or .gql files as strings."},"warnings":[{"fix":"Migrate to a maintained alternative like @rollup/plugin-graphql or graphql-vite-plugin.","message":"Package is unmaintained since 2021 and relies on Vite 1.x plugin API, which is incompatible with Vite 2+.","severity":"deprecated","affected_versions":">=0.1.0"},{"fix":"Do not use with Vite 2+; find a compatible plugin or upgrade approach.","message":"Requires Vite ^1.0.0; will not work with Vite 2.x or later due to API changes.","severity":"breaking","affected_versions":">=0.1.0"},{"fix":"If you need parsed documents, use graphql-tag together with this plugin, or switch to a more feature-rich loader.","message":"The plugin does not parse .graphql files; it only returns the raw file content as a string. No GraphQL tags or AST processing.","severity":"gotcha","affected_versions":">=0.1.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Upgrade to a Vite 2+ compatible GraphQL plugin or downgrade Vite to 1.x.","cause":"Trying to use with Vite 2+ where plugin API changed (should be function instead of object).","error":"Error: The plugin 'vite-plugin-graphql' is incompatible with this version of Vite."},{"fix":"Run 'npm install vite-plugin-graphql' and ensure the import matches the package name exactly.","cause":"Package not installed or typo in import name.","error":"Failed to resolve import 'vite-plugin-graphql' from 'vite.config.js'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}