Development Guide

Package Structure

The Sanity package (@repo/sanity) is at packages/sanity/:

packages/sanity/
├── src/
│   ├── index.ts              # Main Sanity config (defineConfig)
│   ├── schema/
│   │   ├── index.ts          # schemaTypes export
│   │   ├── documents/        # Document types (settings, artist, event, …)
│   │   └── objects/          # Object types (currently none)
│   └── utils/
│       └── groups.ts         # Field groups (GROUP, GROUPS, SETTINGS_GROUPS)
├── package.json
├── tsconfig.json
└── eslint.config.mjs

Configuration

Main config: packages/sanity/src/index.ts:

import { SITE_NAME } from '@repo/constants'
import { defineConfig } from 'sanity'
import { structureTool } from 'sanity/structure'
import { visionTool } from '@sanity/vision'
import { media } from 'sanity-plugin-media'
import { references, referencesView } from 'sanity-plugin-references'
import { singletonTools } from 'sanity-plugin-singleton-management'
import { tags } from 'sanity-plugin-tags-v4'
import { userSelect } from 'sanity-plugin-user-select-input'

import { schemaTypes } from './schema'

export default defineConfig({
  name: 'rotunde',
  title: SITE_NAME,
  projectId: 'dm359cdv',
  dataset: 'production',
  plugins: [
    structureTool({
      defaultDocumentNode: (S) =>
        S.document().views([S.view.form(), referencesView(S)]),
    }),
    visionTool(),
    media(),
    singletonTools(),
    tags(),
    userSelect(),
    references(),
  ],
  schema: { types: schemaTypes },
})

Using the Package

The Sanity package is consumed by the Studio app at apps/studio/:

export {default} from '@repo/sanity'

This allows the Studio app to use the shared configuration without duplicating code.

Development Workflow

Running the Studio

To start the Sanity Studio in development mode:

cd apps/studio
pnpm dev

This will start the Studio at http://localhost:3333 (or the next available port).

Building the Studio

To build the Studio for production:

cd apps/studio
pnpm build

Deploying the Studio

To deploy the Studio to Sanity’s hosting:

cd apps/studio
pnpm deploy

Adding Schema Types

Adding a Document Type

Create packages/sanity/src/schema/documents/myDocument.ts and define the type with defineType / defineField.
Export from packages/sanity/src/schema/documents/index.ts: add the import and include it in the schemaDocuments array.
The document will appear in the Studio.

Adding an Object Type

Create a new file in packages/sanity/src/schema/objects/ and export from schema/objects/index.ts in schemaObjects.
Use the type in document fields with type: 'myObject'.

TypeScript Support

The package uses TypeScript with strict type checking. Schema types are automatically typed, and you can generate TypeScript types from your Sanity schema using @sanity/typegen or similar tools.

Linting

The package uses ESLint with Sanity’s recommended configuration:

pnpm lint

Dependencies

Key dependencies:

sanity (^5.4.0) — Core Sanity
@sanity/vision — GROQ Vision tool
sanity-plugin-media — Media browser
sanity-plugin-singleton-management — Singleton tools
sanity-plugin-tags-v4 — Tags field
sanity-plugin-user-select-input — User picker
sanity-plugin-references — References view + plugin
react, styled-components — Studio UI
@repo/constants — SITE_NAME and shared constants

Best Practices

Keep schemas organized: Group related document types together
Use TypeScript: Leverage type safety for schema definitions
Document your schemas: Add descriptions and help text to fields
Validate fields: Use validation rules to ensure data quality
Use singletons appropriately: Only use singleton documents for truly unique content
Test queries: Use the Vision tool to test GROQ queries before using them in code