tanstack-cli by tanstack-skills/tanstack-skills
npx skills add https://github.com/tanstack-skills/tanstack-skills --skill tanstack-cliTanStack CLI 是一个交互式脚手架工具,用于创建 TanStack Start 应用程序。它提供引导式项目创建,包含 30 多个预构建的集成,涵盖身份验证、数据库、部署和开发者工具。它还包含一个用于 AI 助手辅助的 MCP(模型上下文协议)服务器,并支持用于团队标准化设置的自定义模板。
包: @tanstack/cli 状态: 稳定
# 创建新项目(交互式)
npx @tanstack/cli create my-app
# 使用特定集成创建
npx @tanstack/cli create my-app --integrations tanstack-query,clerk,drizzle
# 全局安装
npm install -g @tanstack/cli
tanstack create my-app
npx @tanstack/cli create my-app
# 提示输入:
# - 项目名称
# - 集成选择
# - 配置选项
# 多个集成
npx @tanstack/cli create my-app --integrations tanstack-query,tanstack-form,drizzle,neon,clerk
# 部署目标
npx @tanstack/cli create my-app --integrations vercel
# 全栈设置
npx @tanstack/cli create my-app --integrations tanstack-query,tanstack-form,tanstack-table,clerk,drizzle,neon,vercel,sentry
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
| 集成 | 描述 |
|---|---|
tanstack-query | 异步状态管理 |
tanstack-form | 类型安全的表单管理 |
tanstack-table | 无头表格/数据网格 |
tanstack-store | 响应式数据存储 |
tanstack-virtual | 列表虚拟化 |
tanstack-ai | AI SDK 集成 |
tanstack-db | 客户端数据库 |
tanstack-pacer | 防抖/节流工具 |
| 集成 | 描述 |
|---|---|
clerk | Clerk 身份验证 |
better-auth | Better Auth 集成 |
workos | WorkOS 身份管理 |
| 集成 | 描述 |
|---|---|
drizzle | Drizzle ORM |
prisma | Prisma ORM |
neon | Neon 无服务器 Postgres |
convex | Convex 后端平台 |
| 集成 | 描述 |
|---|---|
vercel | Vercel 部署 |
netlify | Netlify 部署 |
cloudflare | Cloudflare Workers/Pages |
nitro | Nitro 服务器引擎 |
| 集成 | 描述 |
|---|---|
eslint | ESLint 配置 |
biome | Biome 代码检查/格式化 |
shadcn-ui | shadcn/ui 组件库 |
storybook | Storybook 组件开发 |
| 集成 | 描述 |
|---|---|
trpc | tRPC 类型安全 API |
orpc | oRPC 集成 |
| 集成 | 描述 |
|---|---|
sentry | 错误监控 |
paraglide | 国际化 (i18n) |
strapi | Strapi CMS |
# 创建一个项目作为模板基础
npx @tanstack/cli create my-template --integrations tanstack-query,drizzle,clerk
# 作为 Git 仓库或 npm 包共享
# 从 Git 仓库
npx @tanstack/cli create my-app --template https://github.com/myorg/my-template
# 从本地路径
npx @tanstack/cli create my-app --template ./templates/my-template
my-template/
├── template.config.ts # 模板配置
├── src/
│ ├── app/
│ │ ├── routes/
│ │ └── components/
│ └── lib/
├── package.json
├── tsconfig.json
├── app.config.ts
└── vite.config.ts
TanStack CLI 包含一个用于 AI 助手集成的 MCP(模型上下文协议)服务器。
MCP 服务器使 Claude 和其他 AI 助手能够:
// .claude/mcp.json 或等效文件
{
"mcpServers": {
"tanstack": {
"command": "npx",
"args": ["@tanstack/cli", "mcp"]
}
}
}
一个典型的生成项目结构如下:
my-app/
├── src/
│ ├── app/
│ │ ├── routes/
│ │ │ ├── __root.tsx
│ │ │ └── index.tsx
│ │ ├── router.tsx
│ │ ├── routeTree.gen.ts
│ │ └── client.tsx
│ ├── lib/
│ │ ├── db.ts # (如果使用 drizzle/prisma)
│ │ ├── auth.ts # (如果使用 clerk/better-auth)
│ │ └── query.ts # (如果使用 tanstack-query)
│ └── components/
├── app.config.ts
├── vite.config.ts
├── package.json
├── tsconfig.json
└── .env.example
TanStack CLI 还提供了一个交互式的基于 Web 的构建器:
| 命令 | 描述 |
|---|---|
create <name> | 创建新项目 |
create <name> --integrations <list> | 使用特定集成创建 |
create <name> --template <path> | 从模板创建 |
mcp | 启动 MCP 服务器 |
--integrations 标志,以实现可重复的项目创建.env.example,查看所需的环境变量clerk,drizzle,neon).env.example)npm install / pnpm installnpx @tanstack/cli 获取最新版本)每周安装量
73
代码仓库
GitHub 星标数
5
首次出现
2026年2月21日
安全审计
安装于
codex69
opencode68
cursor67
gemini-cli67
amp66
kimi-cli66
TanStack CLI is an interactive scaffolding tool for creating TanStack Start applications. It provides guided project creation with 30+ pre-built integrations covering authentication, databases, deployment, and developer tools. It also includes an MCP (Model Context Protocol) server for AI agent assistance and supports custom templates for team-standardized setups.
Package: @tanstack/cli Status: Stable
# Create a new project (interactive)
npx @tanstack/cli create my-app
# Create with specific integrations
npx @tanstack/cli create my-app --integrations tanstack-query,clerk,drizzle
# Global install
npm install -g @tanstack/cli
tanstack create my-app
npx @tanstack/cli create my-app
# Prompts for:
# - Project name
# - Integration selection
# - Configuration options
# Multiple integrations
npx @tanstack/cli create my-app --integrations tanstack-query,tanstack-form,drizzle,neon,clerk
# Deployment target
npx @tanstack/cli create my-app --integrations vercel
# Full stack setup
npx @tanstack/cli create my-app --integrations tanstack-query,tanstack-form,tanstack-table,clerk,drizzle,neon,vercel,sentry
| Integration | Description |
|---|---|
tanstack-query | Async state management |
tanstack-form | Type-safe form management |
tanstack-table | Headless table/datagrid |
tanstack-store | Reactive data store |
tanstack-virtual | List virtualization |
tanstack-ai | AI SDK integration |
| Integration | Description |
|---|---|
clerk | Clerk authentication |
better-auth | Better Auth integration |
workos | WorkOS identity management |
| Integration | Description |
|---|---|
drizzle | Drizzle ORM |
prisma | Prisma ORM |
neon | Neon serverless Postgres |
convex | Convex backend platform |
| Integration | Description |
|---|---|
vercel | Vercel deployment |
netlify | Netlify deployment |
cloudflare | Cloudflare Workers/Pages |
nitro | Nitro server engine |
| Integration | Description |
|---|---|
eslint | ESLint configuration |
biome | Biome linting/formatting |
shadcn-ui | shadcn/ui component library |
storybook | Storybook component development |
| Integration | Description |
|---|---|
trpc | tRPC type-safe API |
orpc | oRPC integration |
| Integration | Description |
|---|---|
sentry | Error monitoring |
paraglide | Internationalization (i18n) |
strapi | Strapi CMS |
# Create a project as a template base
npx @tanstack/cli create my-template --integrations tanstack-query,drizzle,clerk
# Share as a git repository or npm package
# From git repository
npx @tanstack/cli create my-app --template https://github.com/myorg/my-template
# From local path
npx @tanstack/cli create my-app --template ./templates/my-template
my-template/
├── template.config.ts # Template configuration
├── src/
│ ├── app/
│ │ ├── routes/
│ │ └── components/
│ └── lib/
├── package.json
├── tsconfig.json
├── app.config.ts
└── vite.config.ts
The TanStack CLI includes an MCP (Model Context Protocol) server for AI agent integration.
The MCP server enables Claude and other AI assistants to:
// .claude/mcp.json or equivalent
{
"mcpServers": {
"tanstack": {
"command": "npx",
"args": ["@tanstack/cli", "mcp"]
}
}
}
A typical generated project looks like:
my-app/
├── src/
│ ├── app/
│ │ ├── routes/
│ │ │ ├── __root.tsx
│ │ │ └── index.tsx
│ │ ├── router.tsx
│ │ ├── routeTree.gen.ts
│ │ └── client.tsx
│ ├── lib/
│ │ ├── db.ts # (if drizzle/prisma)
│ │ ├── auth.ts # (if clerk/better-auth)
│ │ └── query.ts # (if tanstack-query)
│ └── components/
├── app.config.ts
├── vite.config.ts
├── package.json
├── tsconfig.json
└── .env.example
TanStack CLI also provides an interactive web-based builder:
| Command | Description |
|---|---|
create <name> | Create a new project |
create <name> --integrations <list> | Create with specific integrations |
create <name> --template <path> | Create from template |
mcp | Start the MCP server |
--integrations flag for reproducible project creation in CI/docs.env.example after generation for required environment variablesclerk,drizzle,neon).env.example)npm install / pnpm install after generationnpx @tanstack/cli for latest)Weekly Installs
73
Repository
GitHub Stars
5
First Seen
Feb 21, 2026
Security Audits
Gen Agent Trust HubPassSocketWarnSnykWarn
Installed on
codex69
opencode68
cursor67
gemini-cli67
amp66
kimi-cli66
LarkSuite Whiteboard CLI 工具:自动化生成专业图表与画板,支持DSL和Mermaid
37,400 周安装
可用性测试计划模板:UX研究指南与最佳实践 | 用户体验设计
156 周安装
设计系统命名规范指南:组件、令牌、文件命名原则与最佳实践
161 周安装
品牌命名策略完整指南:SMILE & SCRATCH框架、命名矩阵与专家方法论
102 周安装
Claude代码执行插件:Python批量操作节省90-99%令牌,本地执行API提升开发效率
113 周安装
Bun 极速 JavaScript 运行时:一体化工具包,构建运行 JS/TS 应用
98 周安装
Headless UI - 完全无障碍的React/Vue UI组件库 | 与Tailwind CSS完美集成
107 周安装
tanstack-db | Client-side database |
tanstack-pacer | Debouncing/throttling utilities |