Keeping your project in sync

The CLI manages two things in your project: type definitions and fallback content. Both need to stay in sync with your workspace so that your code reflects the latest schemas and your application always has content to render.

This guide shows which command to run for each common scenario.

Quick reference

If you already know what changed and just need the right command, use this summary as a quick lookup:

What the CLI manages

The CLI keeps two categories of generated artifacts in your project. Understanding what they are helps you know why syncing matters.

Type definitions are generated from your slot and component schemas. They give your editor autocomplete and type checking when working with content. For a deeper look at how this works, see Type generation.

Fallback content is the default content downloaded for each slot, version, and locale. The SDK uses it as an automatic fallback so your application always renders meaningful content, even during network failures. For more details, see Fallback content.

Automatic synchronization

Depending on the SDK, the install command can register a hook that runs automatically when you install dependencies. When this hook is set up, installing dependencies also runs croct install behind the scenes, keeping types and content in sync automatically.

In most cases, this means things stay up to date without any extra effort. The scenarios below cover what to do when you need to sync manually.

Syncing at your own pace

Changes you make in the admin panel never break your project. Schemas are versioned, so your code continues to work with the version it was built against until you explicitly update or upgrade. You can sync whenever it fits your workflow.

The admin panel also helps you stay aware: whenever you make a change that requires syncing, it prompts you with the appropriate command.

Run from the browser

With deep links enabled, you can trigger CLI commands directly from the browser by clicking the run buttons in the admin panel or documentation.

Common scenarios

Here are the most frequent situations where you may need to sync your project manually, along with the right command for each one.

Cloning or reinstalling

After cloning a repository or running a fresh dependency install, you need to generate types and download content. If the automatic hook is set up, this happens automatically. Otherwise, regenerate everything from your configuration file by running:

npx croct@latest install

Adding a new slot

To start using a slot that exists in your workspace but is not yet in your project, add it to the configuration file along with its types and default content by running:

npx croct@latest add slot

Adding a new component

To add a component to your project along with its type definitions, run:

npx croct@latest add component

Editing default content

After changing a slot's default content in the admin, your local fallback content is outdated. To pull the latest content and regenerate type definitions, run:

npx croct@latest update

Changing a schema

When you modify a schema in the admin (for example, adding a new field to a slot or updating a component structure), your local types no longer match. To regenerate types and re-download content, run:

npx croct@latest update

Upgrading to a new version

When a new major version is published and you want to adopt it, update the version specifiers in the configuration file and regenerate types and content by running:

npx croct@latest upgrade

After upgrading, remember to update any version references in your code, such as slot identifiers in fetch calls (e.g., home-hero@1 to home-hero@2).

Explore

Check out these links to learn more: