Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/weiyi88/cc-code/next2taronpx skills add weiyi88/cc-code --skill next2tarogit clone --depth 1 https://github.com/weiyi88/cc-codeWhat it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00071 | $0.06733 |
| Opus 5 | $0.00036 | $0.03367 |
| Sonnet 5 | $0.00014 | $0.01347 |
| Haiku 4.5 | $0.00007 | $0.00673 |
Grade A, and why
next2taro scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 492 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Next.js → Taro UI 转换技能
将 Next.js (App Router + Tailwind CSS + shadcn/ui) 的 UI 精确还原为 Taro 小程序 (View/Text + 手写 SCSS + PNG 图片)，遵循转换宪法规则。
适用场景
- Next.js 项目迁移到微信/支付宝/抖音小程序
- 已有 Next.js UI 设计稿，需要在小程序端还原
- Taro 项目中某个页面/组件需要对照 Next.js 原版修正
转换宪法（铁律）
§1 标签映射
| 铁律 | Next.js | Taro | 说明 |
|---|---|---|---|
| 1.1 | <div> |
<View> |
所有块级容器 |
| 1.2 | <span> / <p> / <h1>~<h6> |
<Text> |
所有文本，必须用 Text 包裹 |
| 1.3 | <svg> / 内联 SVG |
<Image> + PNG |
SVG 必须导出为 PNG，禁止内联 |
| 1.4 | <img> |
<Image mode="aspectFit"> |
图片组件，必须设置 mode |
| 1.5 | <a> / <Link href> |
Taro.navigateTo / switchTab |
路由跳转（见 §6） |
| 1.6 | <button> |
<View> + onClick |
按钮用 View 模拟 |
| 1.7 | <input> / <textarea> |
<Input> / 自定义 <Input type="textarea"> |
表单组件 |
| 1.8 | <label> / <form> |
<View> 模拟 |
无语义标签 |
| 1.9 | <header> / <main> / <footer> |
<View> |
语义标签 → View |
§2 样式系统
| 铁律 | 规则 | 原因 |
|---|---|---|
| 2.1 | 单一 class 选择器（.foo），禁止嵌套/后代/标签选择器 |
RN 兼容 + 小程序样式隔离 |
| 2.2 | 只用 px 单位，禁止 rpx / rem / em |
pxtransform 自动转换 |
| 2.3 | 禁止 grid 布局，只用 flex |
RN 不支持 grid |
| 2.4 | 禁止伪类/伪元素（:hover / ::before / ::after） |
RN 不支持，用额外 View 模拟 |
| 2.5 | box-shadow 小程序可用，RN 需用 elevation 替代 |
跨端兼容 |
| 2.6 | transition 小程序可用，RN 需用 Animated 替代 |
跨端兼容 |
| 2.7 | 所有值引用 variables.scss，禁止魔法数字 |
可维护性 |
| 2.8 | 禁止 calc() 表达式，用 width:50% + padding 间距替代 |
小程序兼容性差 |
| 2.9 | Taro <Text> 多行文字必须设 word-break: break-word + line-height: $leading-loose |
防止文字重叠（实战踩坑） |
| 2.10 | 渐变背景容器的子元素需 overflow: hidden + border-radius: 9999px |
防止渐变在方圆角下溢出（实战踩坑） |
§3 设计像素体系（designWidth:750）
SCSS 中的 px 值 = 实际像素 × 2
例：14px 实际 → SCSS 写 28px
原因：designWidth:750 下 pxtransform 按 1:1 转换 rpx
而 750 设计稿中 1rpx = 0.5 物理像素
常用映射表：
| 实际像素 | SCSS 值 | Tailwind 对应 |
|---|---|---|
| 12px | 24px | text-xs |
| 14px | 28px | text-sm |
| 16px | 32px | text-base / p-4 |
| 18px | 36px | text-lg |
| 20px | 40px | text-xl |
| 24px | 48px | text-2xl |
| 30px | 60px | text-3xl |
| 8px | 16px | gap-2 / p-2 |
| 10px | 20px | gap-2.5 / p-2.5 |
| 12px | 24px | gap-3 / p-3 |
| 16px | 32px | gap-4 / p-4 |
| 20px | 40px | gap-5 / p-5 |
| 24px | 48px | gap-6 / p-6 |
| 4px | 8px | rounded-sm |
| 8px | 16px | rounded-md |
| 16px | 32px | rounded-lg |
| 20px | 40px | rounded-xl |
| 24px | 48px | rounded-2xl |
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago First seen · 492 lines · 71 tokens per session scan A eec5092acc74
next2taro is a skill published in the GitHub repository weiyi88/cc-code (5 stars, last pushed 6d ago), licensed MIT. It adds 71 tokens to every session and 6,733 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
state-machine
Task lifecycle state transitions with validation gates. Defines states, triggers, and required proofs.
skill-creator
Create new skills, modify and improve existing skills, and measure skill performance. Use when users want to create a skill from scratch, edit, or optimize an existing skill, run evals to test a skill, benchmark skill performance with variance analysis, or optimize a skill's description for better triggering accuracy.
mutation-testing
Mutation testing patterns for verifying test effectiveness. Use when analyzing branch code to find weak or missing tests.
planning
Planning work in small, known-good increments. Use when starting significant work or breaking down complex tasks.
testing
Testing patterns for behavior-driven tests. Use when writing tests or test factories.
davinci-define
Apply the 7 Da Vincian Principles to define problems, set direction, and reflect on life choices. Use for career decisions, goal setting, life planning, or when you need to clarify what the real question is before solving it.