Mearie

Mearie is a type-safe GraphQL client with zero runtime overhead. Write queries as template literals and get automatic type generation at build time. The library provides normalized caching, fragment colocation, and composable middleware. Works with vanilla JavaScript or any framework (React, Vue, Svelte, and Solid bindings included).

Here's a quick example:

import { createClient, httpLink, cacheLink, graphql } from 'mearie';
import { ClientProvider, useQuery } from '@mearie/react';

const client = createClient({
  links: [cacheLink(), httpLink({ url: 'https://api.example.com/graphql' })],
});

export function App() {
  return (
    <ClientProvider client={client}>
      <UserProfile userId="1" />
    </ClientProvider>
  );
}

function UserProfile({ userId }: { userId: string }) {
  const { data, loading } = useQuery(
    graphql(`
      query GetUser($id: ID!) {
        user(id: $id) {
          id
          name
          email
        }
      }
    `),
    { id: userId },
  );

  if (loading) return <div>Loading...</div>;
  return <h1>{data.user.name}</h1>;
}

Documentation

Full documentation is available at https://mearie.dev/.

Etymology

The name Mearie (pronounced /meh-ah-ree/) comes from the Korean word 메아리, meaning echo.