npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

codegen-prismic-fetch

v1.0.5

Published

A customFetch implementation for using @graphql-codegen with Prismic.io GraphQL APIs

Downloads

3,296

Readme

codegen-prismic-fetch

npm version

A customFetch implementation for using GraphQL Code Generator with Prismic CMS

Prerequisites

This package helps you connect an existing GraphQL Code Generator setup to an existing Prismic CMS endpoint.

If you're not familiar with graphql-codegen, follow the GraphQL Code Generator getting started guide to set up graphql-codegen (and graphql itself) with your npm/yarn-based app, and then come back here to get graphql-codegen talking to your Prismic endpoint.

Usage

npm i --save codegen-prismic-fetch

Or with yarn

yarn add codegen-prismic-fetch

Add a customFetch to your codegen.yml:

customFetch: codegen-prismic-fetch

See the codegen docs for details on customFetch usage.

Authentication

If your API is private you'll need to specify an access token. You can do this in any of three ways:

  • Set the PRISMIC_ACCESS_TOKEN environment variable
  • Include access_token in your codegen.yml schema URL: schema: "https://[your-repo-name].cdn.prismic.io/graphql?access_token=YOUR_TOKEN"
  • Include an Authorization header under schema in your codegen.yml. Make sure to include the prefix Token , eg:
schema:
  https://[your-repo-name].cdn.prismic.io/graphql:
    headers:
      Authorization: Token YOUR_TOKEN

Example

Setting customFetch globally

customFetch: "codegen-prismic-fetch"
schema: https://[your-repo-name].cdn.prismic.io/graphql

Setting customFetch under the schema

schema:
  https://[your-repo-name].cdn.prismic.io/graphql:
    customFetch: "codegen-prismic-fetch"

With an access token

schema:
  https://[your-repo-name].cdn.prismic.io/graphql:
    customFetch: "codegen-prismic-fetch"
    headers:
      Authorization: Token YOUR_TOKEN

How does it work?

Prismic has an unusual requirement which makes this library necessary - before making a graphql query we must make a call to the REST API to find the identifier of the current "master" ref, and then we must pass it along in any graphql query by setting the Prismic-ref HTTP header. This library infers the API endpoint from your graphql endpoint, performs a fetch to get your master ref, and then adds that into codegen's graphql introspection queries.

Prismic also requires all queries to use the GET method. You can specify this with codegen's method: GET option, but that's not necessary when using this library - we effectively set it for you by transforming all requests to GET requests.