Options

Configure urql client with options under urql key of nuxt config.

`endpoint`

The absolute URL to connect to the graphql API.

nuxt.config

export default defineNuxtConfig({
  urql: {
    endpoint: "http://...",
  },
});

`client` [object]

Small subset of urql client options.

`client.requestPolicy`

The default request policy for requests.

`client.preferGetMethod`

Use HTTP GET for queries.

`client.maskTypename`

Mask __typename from results.

`client` [string]

default: urql.config

Path to the file (.json,.js,.ts) to configure client (fetch options, exchanges, ...).

Use the defineUrqlClient helper as the default export to return ClientOptions

urql.config.ts

import { fetchExchange } from "@urql/core";
import { cacheExchange } from "@urql/exchange-graphcache";
import { defineUrqlClient } from "#urql/client";

// use urql graphcache
const cacheConfig: GraphCacheConfig = {
  schema,
  keys: {
    // ...
  },
  resolvers: {
    // ...
  },
};

export default defineUrqlClient((ssrExchange) => {
  const exchanges = process.server
    ? [ssrExchange, fetchExchange]
    : [cacheExchange(cacheConfig), ssrExchange, fetchExchange];

  const headers = useRequestHeaders(["cookie", "authorization"]);

  return {
    exchanges,
    fetchOptions: () => ({ headers }),
  };
});

`ssr`

Options relative to the SSR exchange.

For more information go to urql server side rendering page.

`ssr.key`

default: __URQL_DATA__

Key name used by the SSR exchange to send its data in nuxt payload.

`ssr.staleWhileRevalidate`

Update data immediately after rehydration.

`ssr.includeExtensions`

Include graphql extensions in payload.

GuideSetup

GuideUsage