Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including @urql/preact with all npm packages installed. Try it out:

require("graphql/package.json"); // graphql is a peer dependency. require("preact/package.json"); // preact is a peer dependency. var preact = require("@urql/preact")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@urql/preact v1.3.2

A highly customizable and versatile GraphQL client for Preact

Installation

yarn add @urql/preact urql graphql
# or
npm install --save @urql/preact urql graphql

Usage

The usage is a 1:1 mapping of the React usage found here

small example:

import { createClient, defaultExchanges, Provider, useQuery } from '@urql/preact';

const client = createClient({
  url: 'https://myHost/graphql',
  exchanges: defaultExchanges,
});

const App = () => (
  <Provider value={client}>
    <Dogs />
  </Provider>
);

const Dogs = () => {
  const [result] = useQuery({
    query: `{ dogs { id name } }`,
  });

  if (result.fetching) return <p>Loading...</p>;
  if (result.error) return <p>Oh no...</p>;

  return result.data.dogs.map(dog => <p>{dog.name} is a good boy!</p>);
};
RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free