The Guild LogoThe Guild Monogram

Search docs

Search icon

Products by The Guild

Products

Hive logoHive blurred logo

Hive

Schema Registry for your GraphQL Workflows

Docs

Get Started

JavaScript Output#

Although the focus of GQty is to be used in TypeScript, it's completely possible to use it in JavaScript projects, outputting valid JavaScript code, alongside it's type-definitions, and using JSDoc to be able to use a typed GQty.

We recommend taking a look at Type Checking JavaScript files, allowJs and checkJs.

Configuration#

To enable JavaScript Output you have to especify an extra javascriptOutput property in your Configuration file, with some extra considerations:

/** * @type {import("@gqty/cli").GQtyConfig} */ const config = { // It should be set as 'true' or removed. enumsAsStrings: true, // You have to specify the '.js' extension destination: './src/gqty/index.js', // This has to be set as 'true' javascriptOutput: true, }; module.exports = config;

And the client will be created following the structure:

src/gqty ├── schema.generated.d.ts # Generated schema, you shouldn't modify it manually ├── schema.generated.js # Generated schema, you shouldn't modify it manually └── index.js # gqty client is exported from here, you can safely modify it based on your needs

Usage#

The usage should be exactly the same:

import { query, resolved } from './gqty/index.js'; resolved(() => { const dogsNames = query.dogs.map((dog) => { return dog.name; }); return { type: query.time, dogsNames, }; }) .then((data) => { console.log({ data, }); }) .catch(console.error);

With the caveat that, even if the autocomplete might allow you to import the types, it will probably mean a runtime-error:

Javascript Output Type Error

To use the types, you have to use the JSDoc @type:

import { query, resolved } from '../gqty'; // ... // Here user should be automatically typed const user = await resolved((query) => { const user = query.user({ id: '1', }); user.id; user.name; return user; }); function readUserData( /** * @type {import("./gqty").User} */ user ) { // Here `user` will be typed } readUserData(user);

For Node.js usage, if you don't have "type": "module" in your package.json, you might have to manually modify some imports to requires, since for now, outputting .mjs doesn't have much utility, since TypeScript doesn't support it yet