Maintain Custom Add-ons In Dev Watch

Use this skill for local add-on authoring workflows where you continuously compile and sync package output into a target app.

25 stars

Best use case

Maintain Custom Add-ons In Dev Watch is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Use this skill for local add-on authoring workflows where you continuously compile and sync package output into a target app.

Teams using Maintain Custom Add-ons In Dev Watch should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/maintain-custom-addons-dev-watch/SKILL.md --create-dirs "https://raw.githubusercontent.com/ComeOnOliver/skillshub/main/skills/TanStack/cli/maintain-custom-addons-dev-watch/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/maintain-custom-addons-dev-watch/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How Maintain Custom Add-ons In Dev Watch Compares

Feature / AgentMaintain Custom Add-ons In Dev WatchStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Use this skill for local add-on authoring workflows where you continuously compile and sync package output into a target app.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Maintain Custom Add-ons In Dev Watch

Use this skill for local add-on authoring workflows where you continuously compile and sync package output into a target app.

## Setup

```bash
npx @tanstack/cli add-on init
npx @tanstack/cli add-on compile
```

## Core Patterns

### Run add-on dev loop while editing source

```bash
npx @tanstack/cli add-on dev
```

### Sync watched framework directory into a sandbox target app

```bash
# --dev-watch is a flag on `create`, not on `dev`
npx @tanstack/cli create my-sandbox --dev-watch ../path/to/framework-dir
```

### Re-run compile before apply when changing metadata

```bash
npx @tanstack/cli add-on compile
npx @tanstack/cli add my-custom-addon
```

## Common Mistakes

### HIGH Use --dev-watch with --no-install

Wrong:
```bash
npx @tanstack/cli create my-sandbox --dev-watch ../my-addon-package --no-install
```

Correct:
```bash
npx @tanstack/cli create my-sandbox --dev-watch ../my-addon-package
```

Dev-watch rejects `--no-install`, so automated loops fail before any sync work starts.

Source: packages/cli/src/dev-watch.ts:112

### HIGH Start dev-watch without valid framework directory

Wrong:
```bash
npx @tanstack/cli create my-sandbox --dev-watch ../missing-or-invalid-dir
```

Correct:
```bash
npx @tanstack/cli create my-sandbox --dev-watch ../valid-framework-dir
```

Watch setup validates that the path exists, is a directory, and contains at least one of `add-ons/`, `assets/`, or `framework.json`. Invalid targets fail before file syncing begins.

Source: packages/cli/src/command-line.ts:599

### CRITICAL Author add-on from code-router project

Wrong:
```bash
npx @tanstack/cli add-on init
```

Correct:
```bash
# Run add-on init from a file-router project
npx @tanstack/cli add-on init
```

Custom add-on authoring expects file-router mode and exits when run from incompatible project modes.

Source: packages/create/src/custom-add-ons/add-on.ts

### HIGH Run add-on workflows without scaffold metadata

Wrong:
```bash
npx @tanstack/cli add-on dev
```

Correct:
```bash
# Run in a project scaffolded by TanStack CLI (contains .cta.json), then:
npx @tanstack/cli add-on dev
```

Custom add-on flows rely on persisted scaffold options, so missing metadata blocks initialization and update paths.

Source: packages/create/src/custom-add-ons/shared.ts:158

### HIGH Tension: Backwards support vs deterministic automation

This domain's patterns conflict with add-addons-existing-app. Tooling assumes reusable automation, but hidden metadata preconditions from legacy support make add-on loops non-portable across repositories.

See also: add-addons-existing-app/SKILL.md § Common Mistakes

Related Skills

customerio-webhooks-events

25
from ComeOnOliver/skillshub

Implement Customer.io webhook and reporting event handling. Use when processing email delivery events, click/open tracking, bounce handling, or streaming to a data warehouse. Trigger: "customer.io webhook", "customer.io events", "customer.io delivery status", "customer.io bounces", "customer.io open tracking".

customerio-upgrade-migration

25
from ComeOnOliver/skillshub

Plan and execute Customer.io SDK upgrades and migrations. Use when upgrading customerio-node versions, migrating from legacy APIs, or updating to new SDK patterns. Trigger: "upgrade customer.io", "customer.io migration", "update customer.io sdk", "customer.io breaking changes".

customerio-security-basics

25
from ComeOnOliver/skillshub

Apply Customer.io security best practices. Use when implementing secure credential storage, PII handling, webhook signature verification, or GDPR/CCPA compliance. Trigger: "customer.io security", "customer.io pii", "secure customer.io", "customer.io gdpr", "customer.io webhook verify".

customerio-sdk-patterns

25
from ComeOnOliver/skillshub

Apply production-ready Customer.io SDK patterns. Use when implementing typed clients, retry logic, event batching, or singleton management for customerio-node. Trigger: "customer.io best practices", "customer.io patterns", "production customer.io", "customer.io architecture", "customer.io singleton".

customerio-reliability-patterns

25
from ComeOnOliver/skillshub

Implement Customer.io reliability and fault-tolerance patterns. Use when building circuit breakers, fallback queues, idempotency, or graceful degradation for Customer.io integrations. Trigger: "customer.io reliability", "customer.io resilience", "customer.io circuit breaker", "customer.io fault tolerance".

customerio-reference-architecture

25
from ComeOnOliver/skillshub

Implement Customer.io enterprise reference architecture. Use when designing integration layers, event-driven architectures, or enterprise-grade Customer.io setups. Trigger: "customer.io architecture", "customer.io design", "customer.io enterprise", "customer.io integration pattern".

customerio-rate-limits

25
from ComeOnOliver/skillshub

Implement Customer.io rate limiting and backoff. Use when handling high-volume API calls, implementing retry logic, or hitting 429 errors. Trigger: "customer.io rate limit", "customer.io throttle", "customer.io 429", "customer.io backoff", "customer.io too many requests".

customerio-prod-checklist

25
from ComeOnOliver/skillshub

Execute Customer.io production deployment checklist. Use when preparing for production launch, auditing integration quality, or performing pre-launch validation. Trigger: "customer.io production", "customer.io checklist", "deploy customer.io", "customer.io go-live", "customer.io launch".

customerio-primary-workflow

25
from ComeOnOliver/skillshub

Implement Customer.io primary messaging workflow. Use when setting up campaign triggers, welcome sequences, onboarding flows, or event-driven email automation. Trigger: "customer.io campaign", "customer.io workflow", "customer.io email automation", "customer.io messaging", "customer.io onboarding".

customerio-performance-tuning

25
from ComeOnOliver/skillshub

Optimize Customer.io API performance for high throughput. Use when improving response times, implementing connection pooling, batching, caching, or regional routing. Trigger: "customer.io performance", "optimize customer.io", "customer.io latency", "customer.io connection pooling".

customerio-observability

25
from ComeOnOliver/skillshub

Set up Customer.io monitoring and observability. Use when implementing metrics, structured logging, alerting, or Grafana dashboards for Customer.io integrations. Trigger: "customer.io monitoring", "customer.io metrics", "customer.io dashboard", "customer.io alerts", "customer.io observability".

customerio-multi-env-setup

25
from ComeOnOliver/skillshub

Configure Customer.io multi-environment setup with workspace isolation. Use when setting up dev/staging/prod workspaces, environment-aware clients, or Kubernetes config overlays. Trigger: "customer.io environments", "customer.io staging", "customer.io dev prod", "customer.io workspace isolation".