Tiptap Editor 3.0 Beta is out. Start here
Tiptap Docs

How to integrate Tiptap Pro extensions?

EditorContent AICollaborationDocuments

Tiptap Pro and Cloud Extensions unlock features like collaboration, version history, comments, AI-assisted editing and more. You install them from Tiptap's private NPM registry with your personal access token.

Security warning

Treat your authentication tokens like passwords to prevent unauthorized use. Each Tiptap user has a unique authentication token that does not expire. We recommend creating a dedicated user for CI/CD applications.

Get your access token

  1. Sign in to your Tiptap account (or sign up).
  2. Start your trial or subscribe to a Tiptap plan.
  3. Copy your personal NPM token from My features → Pro Extensions.

Configure authentication per project

Add the registry and token to the package-manager config in your project root.

Tip

Reference TIPTAP_PRO_TOKEN as an environment variable to avoid committing credentials.

npm, pnpm, or Yarn Classic

Create or update .npmrc:

@tiptap-pro:registry=https://registry.tiptap.dev/
//registry.tiptap.dev/:_authToken=${TIPTAP_PRO_TOKEN}

Yarn Modern (Yarn 2+)

Create or update .yarnrc.yml:

npmScopes:
 tiptap-pro:
   npmAlwaysAuth: true
   npmRegistryServer: "https://registry.tiptap.dev/"
   npmAuthToken: ${TIPTAP_PRO_TOKEN}

Add .npmrc or .yarnrc.yml to .gitignore.

Warning

This is essential to avoid leaking your credentials if you specify the authentication token directly in the configuration file.

Once you've configured authentication for a project, you can install Pro Extensions like any other Editor extension.

If you use environment variables, pass the authentication token during installation:

TIPTAP_PRO_TOKEN=actual-auth-token npm install --save @tiptap-pro/extension-unique-id

Configure global authentication

You can set up authentication once for all of your projects by updating the package manager configuration file at the user level. This is useful for CI/CD environments.

  1. Sign in to your Tiptap account (or create a free one).
  2. Start your trial or subscribe to a Tiptap plan.
  3. (Optional) Invite a team member for your CI/CD pipeline.
  4. Copy your personal NPM token from My features → Pro Extensions.

npm or Yarn Classic 

npm config set "@tiptap-pro:registry" https://registry.tiptap.dev/
npm config set "//registry.tiptap.dev/:_authToken" actual-auth-token

Yarn Modern 

yarn config set --home npmScopes.@tiptap-pro.npmRegistryServer "https://registry.tiptap.dev/"
yarn config set --home npmScopes.@tiptap-pro.npmAlwaysAuth "true"
yarn config set --home npmScopes.@tiptap-pro.npmAuthToken "actual-auth-token"

pnpm 

pnpm config set --global "@tiptap-pro:registry" https://registry.tiptap.dev/
pnpm config set "//registry.tiptap.dev/:_authToken" actual-auth-token

You can now install any Tiptap Pro extension in any repository:

npm install --save @tiptap-pro/extension-unique-id