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 🙏

© 2026 – Pkg Stats / Ryan Hefner

next-sanity

v13.0.11

Published

Sanity.io toolkit for Next.js

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

rexxarsrexxarssanity-svc.npmsanity-svc.npmsanity-iosanity-io

Keywords

livenext.jspreviewsanitysanity.iostudiostudio-v3

Readme

next-sanity

The all-in-one Sanity toolkit for production-grade content-editable Next.js applications.

  • Next.js + Sanity quick start: Get a working Next.js + Sanity project running in minutes, from creating a Sanity project to querying your first content.
  • next-sanity overview: Explore everything the next-sanity package has to offer.
  • Configure the next-sanity client: Set up the Sanity client with environment variables, CDN caching, and per-request overrides for different fetching contexts.
  • Query with GROQ: Make type safe queries with GROQ using the included Sanity client.
  • Visual editing and live preview: Enable click-to-edit overlays and real-time content updates in the Presentation Tool using Draft Mode, defineLive, and the <VisualEditing /> component.
  • Caching and revalidation: Control content freshness with time-based, tag-based, and path-based revalidation strategies for applications that need fine-grained cache management.
  • Reference documentation: Browse the full next-sanity API reference for detailed type signatures and configuration options.

Quicklinks: Sanity docs | Next.js docs | Clean starter template | Fully-featured starter template

Table of contents

Quick Start

Instantly create a new free Sanity project – or link to an existing one – from the command line and connect it to your Next.js application by the following terminal command in your Next.js project folder:

npx sanity@latest init

If you do not yet have a Sanity account you will be prompted to create one. This command will create the basic utilities required to query content from Sanity, and optionally embed Sanity Studio — a configurable content management system — at a route in your Next.js application. See the Embedded Sanity Studio guide.

Manual installation

If you do not yet have a Next.js application, you can create one with the following command:

npx create-next-app@latest

This README assumes you have chosen all of the default options, but should be fairly similar for most bootstrapped Next.js projects.

Install next-sanity

Inside your Next.js application, run the following command in the package manager of your choice to install the next-sanity toolkit:

npm install next-sanity @sanity/image-url
yarn add next-sanity @sanity/image-url
pnpm install next-sanity @sanity/image-url
bun install next-sanity @sanity/image-url

This also installs @sanity/image-url for [On-Demand Image Transformations][image-url] to render images from Sanity's CDN.

Optional: peer dependencies for embedded Sanity Studio

When using npm newer than v7, or pnpm newer than v8, you should end up with needed dependencies like sanity and styled-components when you installed next-sanity. In yarn v1 you can use install-peerdeps:

npx install-peerdeps --yarn next-sanity

Migration guides

License

MIT-licensed. See LICENSE.