Registry / devops / ts-transform-graphql-tag

ts-transform-graphql-tag

library0.2.1jsnpmunverified

A TypeScript custom transformer that compiles GraphQL tagged template strings (gql) at build time using graphql-tag. Version 0.2.1 is the latest stable release; no frequent updates. Key differentiators: reduces bundle size by removing graphql-tag dependency (~50 KB), speeds up runtime initialization, and works with Webpack (awesome-typescript-loader, ts-loader) and FuseBox. It removes imports of graphql-tag and replaces gql`...` with compiled AST objects. Only supports TypeScript; alternatives include babel-plugin-graphql-tag for Babel users.

devops

npm install ts-transform-graphql-tag

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · TS-TRANSFORM-GRAPH

ts-transform-graphql-tag

devopsjavascriptv0.2.1

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

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

getTransformer

✓ import { getTransformer } from 'ts-transform-graphql-tag'

✗ const getTransformer = require('ts-transform-graphql-tag')

CommonJS require works as well, but prefer ESM for consistency with TypeScript codebases.

Shows how to integrate the transformer with ts-loader in a Webpack config.

// webpack.config.js (with ts-loader) const getTransformer = require('ts-transform-graphql-tag').getTransformer; module.exports = { // ... module: { rules: [ { test: /\.tsx?$/, loader: 'ts-loader', options: { getCustomTransformers: () => ({ before: [getTransformer()] }) } } ] } };

Debug

Known issues

breakingTransformer does not work with TypeScript's tsc CLI directly; only via loaders that support custom transformers.

fix

Use a bundler (Webpack/FuseBox) or a custom build step with ts-patch.

affects: >=0.0.0

gotchaThe transformer removes graphql-tag imports, so ensure graphql-tag is not used elsewhere in code after build.

fix

Only import graphql-tag for gql template literals; do not rely on it for other runtime imports.

affects: >=0.0.0

gotchaCompiled output requires the graphql package at runtime; it is not removed from bundle.

fix

Keep graphql as a production dependency.

affects: >=0.0.0

Errors

Common errors & fixes

getCustomTransformers is not a function

Incorrect configuration in Webpack loader options; getCustomTransformers must be a function returning an object.

fix

Use `getCustomTransformers: () => ({ before: [getTransformer()] })` instead of a plain object.

Cannot find module 'graphql-tag'

Missing dev dependency graphql-tag; it is required for the transformer at build time.

fix

Install graphql-tag as a dev dependency: `npm install --save-dev graphql-tag`.

Upgrade

Version history

0.2.1latest on npm

Audit

Dependencies

graphqlrequiredpeer dependency; provides GraphQL types and runtime for compiled queries

graphql-tagoptionalpeer dependency (dev); used to parse GraphQL ASTs at build time

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/firede/ts-transform-graphql-tag ↗

packagets-transform-graphql-tag ↗

homepagehttps://github.com/firede/ts-transform-graphql-tag#readme ↗