官方脚手架与入门模板 (Starter Templates)
上手体验 TUWA 技术栈最敏捷的途径是使用来自 Cosmos Playground 的官方生产级模板:这些脚手架已深度预置钱包连接模块 (Nova Connect / Satellite Connect)、全生命周期交易状态追踪机 (Pulsar) 以及适配深浅色主题的弹窗与通知体系 (Nova Transactions)。大多数模板基于统一的 @tuwaio/sdk;nextjs-tuwa-not-sdk 则演示如何以非 SDK 形式按需导入独立原子包。
🚀 预置模板矩阵
| 模板标识 | 核心演示能力 | 技术栈规格 | 上手难度 |
|---|---|---|---|
nextjs-tuwa | 双链支持:EVM 与 Solana 钱包免配置连接、标准交易与 ERC-4337 抽象账户追踪 | Next.js 16, @tuwaio/sdk, @wagmi/core, @solana/kit | 入门 (Beginner) |
nextjs-evm | 专注 EVM 生态:基于 CAIP-122 标准的 SIWX 钱包签名登录与安全服务端会话管理 | Next.js 16, @tuwaio/sdk, @wagmi/core | 入门 (Beginner) |
nextjs-solana | 专注 Solana 生态:SIWX 多链会话集成与基于 Codama 自动生成的智能合约客户端 | Next.js 16, @tuwaio/sdk, @solana/kit | 入门 (Beginner) |
vite-tuwa | 纯客户端单页应用 (SPA) 架构,极速构建轻量级 DApp | Vite 8, @tuwaio/sdk, @wagmi/core, @solana/kit | 入门 (Beginner) |
nextjs-tuwa-not-sdk | 细粒度架构:拆解 SDK,按需引入 Satellite、Pulsar 与 Nova 核心原子包 | Next.js 16, @wagmi/core, @solana/kit, @tuwaio/pulsar-* | 中级 (Intermediate) |
custom-style | 深度定制设计系统:通过 CSS 变量 --tuwa-* 实现定制换肤 (在线 Demo ) | Vite 8, @tuwaio/sdk | 中级 (Intermediate) |
nextjs-tuwa-quasar | 全栈闭环架构:SIWX 鉴权、跨端云端交易同步、钱包多设备历史与 Webhook 调度 (在线 Demo ) | Next.js 16, @tuwaio/sdk, @tuwaio/quasar-sdk | 高级 (Advanced) |
全部模板源代码位于仓库目录 cosmos-playground/examples 。
所有模板绝不渲染臃肿的
WagmiProvider,也绝不强依赖 React Query:底层组件直接调用 @wagmi/core 的纯函数执行链端交互。所有集成 SIWX 的模板默认将状态保存在签名 HttpOnly Cookie 中,零外部数据库依赖即可顺畅运行。🛠️ 初始化项目
1. 运行交互式脚手架 CLI
npx @tuwaio/create-cosmos-playgroundCLI 将交互式询问模板类型与目标工程名,自动从 GitHub 拉取代码并使用 pnpm 极速安装依赖。
2. 环境变量配置与本地启动
复制模版自带的配置文件并启动本地开发服务:
cp .env.example .envpnpm dev在 nextjs-tuwa-quasar 模板中,若要在本地调试 Webhook 回调通知,只需另起终端窗口执行 pnpm webhooks 启动本地中继转发服务。
3. 借助 AI 编码 Agent 协同开发
每个模板均包含专门配置的 AGENTS.md 指南,直接链接至 TUWA_AGENTS.md ,为大语言模型编程助手提供精准的架构规范与类型上下文。
📚 下一步探索
最后更新于