TypeScript - Overview

Payload supports TypeScript natively, and not only that, the entirety of the CMS is built with TypeScript. To get started developing with Payload and TypeScript, you can use one of Payload's built-in boilerplates in one line via create-payload-app:

Pick a TypeScript project type to get started easily.

It's also possible to set up a TypeScript project from scratch. We plan to write up a guide for exactly how—so keep an eye out for that, too.

Payload exports a number of types that you may find useful while writing your own custom functionality like Plugins, Hooks, Access Control functions, Custom Views, GraphQL queries / mutations or anything else.

• Base config
• Collections
• Globals
• Fields

• Collection hooks
• Global hooks
• Field hooks

Beyond the concrete interfaces in your generated payload-types.ts (Post, User, etc.), Payload exports a set of generic type helpers from the payload package. Instead of referencing a single collection by name, these resolve dynamically against all of your collections and globals — which makes them especially useful in Plugins, reusable Hooks, and Access Control functions, where the exact collection may not be known ahead of time.

When you run payload generate:types, the generated file augments a global GeneratedTypes interface inside the payload module:

Every helper below is generic over this augmented interface. Because the augmentation lives in your project, the helpers resolve to your actual collections wherever your code is type-checked — including inside a third-party plugin's source once it is installed in your project. If GeneratedTypes has not been augmented (for example, in a plugin's own repository before it is consumed), the helpers gracefully fall back to loose types (string, index signatures) rather than erroring.