Using the Tiptap CLI

The Tiptap CLI helps you scaffold editors, install UI components or primitives, and configure Tiptap faster. It removes much of the manual work so you can start building editor features faster.

It’s designed for Vite or Next.js projects. If you use another framework, you’ll need to integrate Tiptap manually from the open-source repository.

Usage

npx @tiptap/cli [command] [options]

Commands

`init`

Initialize your project and install dependencies. This command sets up your project configuration and adds any specified components.

npx @tiptap/cli init

Arguments

components: the components to add

Options

Usage: @tiptap/cli init [options] [components...]

Options:
-f, --framework <framework>   The framework to use (e.g., next, vite)
-f, --force                   Force overwrite of existing configuration
-c, --cwd <cwd>               The working directory (defaults to current directory)
-s, --silent                  Mute output
--src-dir                     Default: Use the src directory when creating a new project
--no-src-dir                  Do not use the src directory when creating a new project

`add`

Add one or more components to your project.

npx @tiptap/cli add [components]

Example

npx @tiptap/cli add button

Options

Usage: @tiptap/cli add [options] [components...]

Arguments

    components          the components to add

Options

    -c, --cwd <cwd>     the working directory (defaults to current directory)
    -p, --path <path>   the path to add the component to
    -s, --silent        mute output