Agent skill

API Mock

在本模板项目中新增或修改 API 接口、类型定义与 vite-plugin-mock 模拟数据。涉及 getBaseApi、http、baseAPI、mock 目录、分页响应格式时使用。

Apache-2.0Auto-check: notes

Install API Mock

skills CLI

$ npx skills add lin-97/gi-demo --skill api-mock -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install lin-97/gi-demo api-mock --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/lin-97/gi-demo.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/api-mock .claude/skills/api-mock && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "api-mock" agent skill from https://github.com/lin-97/gi-demo/tree/master/.agents/skills/api-mock into .claude/skills/api-mock/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "api-mock", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/lin-97/gi-demo/tree/master/.agents/skills/api-mock

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add lin-97/gi-demo --skill api-mock -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install lin-97/gi-demo api-mock --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/lin-97/gi-demo.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/api-mock .agents/skills/api-mock && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "api-mock" agent skill from https://github.com/lin-97/gi-demo/tree/master/.agents/skills/api-mock into .agents/skills/api-mock/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "api-mock", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add lin-97/gi-demo --skill api-mock -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install lin-97/gi-demo api-mock --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/lin-97/gi-demo.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/api-mock .cursor/skills/api-mock && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "api-mock" agent skill from https://github.com/lin-97/gi-demo/tree/master/.agents/skills/api-mock into .cursor/skills/api-mock/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "api-mock", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/lin-97/gi-demo.git --path .agents/skills/api-mock

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add lin-97/gi-demo --skill api-mock -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install lin-97/gi-demo api-mock --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/lin-97/gi-demo.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/api-mock .gemini/skills/api-mock && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "api-mock" agent skill from https://github.com/lin-97/gi-demo/tree/master/.agents/skills/api-mock into .gemini/skills/api-mock/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "api-mock", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install lin-97/gi-demo api-mock

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add lin-97/gi-demo --skill api-mock -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/lin-97/gi-demo.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/api-mock .github/skills/api-mock && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "api-mock" agent skill from https://github.com/lin-97/gi-demo/tree/master/.agents/skills/api-mock into .github/skills/api-mock/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "api-mock", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add lin-97/gi-demo --skill api-mock -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install lin-97/gi-demo api-mock --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/lin-97/gi-demo.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/api-mock .opencode/skills/api-mock && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "api-mock" agent skill from https://github.com/lin-97/gi-demo/tree/master/.agents/skills/api-mock into .opencode/skills/api-mock/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "api-mock", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: api-mock
GitHub stars: 188
Token cost: ~824 tokens
SKILL.md length: 137 words
Files: 1
Skills in repo: 3
Repo updated: Jun 12, 2026
First seen: Oct 7, 2026
Licence: Apache-2.0

At a glance

在本模板项目中新增或修改 API 接口、类型定义与 vite-plugin-mock 模拟数据。涉及 getBaseApi、http、baseAPI、mock 目录、分页响应格式时使用。

Works in 4 steps: 静态数据 → 路由 Mock → 工具函数 → …
SKILL.md covers 接口层结构, getBaseApi 约定路径, 响应格式 and http 封装, plus 3 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

API Mock is an agent skill from lin-97/gi-demo. 在本模板项目中新增或修改 API 接口、类型定义与 vite-plugin-mock 模拟数据。涉及 getBaseApi、http、baseAPI、mock 目录、分页响应格式时使用。

Its SKILL.md is about 820 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It works with Vite. The repository describes itself as: A Vue3 Admin Template. The licence is Apache-2.0.

Example prompts

“/api-mock”

Workflow steps

4 steps, taken from the step headings in SKILL.md.

静态数据
路由 Mock
工具函数
注册

What it can do on your machine

Read from SKILL.md and the folder at commit d1e310a. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are typescript).
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

API Mock loads about 824 tokens when it runs. Until then it costs about 26 tokens; SKILL.md has 137 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~26
When it runs · the whole SKILL.md, loaded when a task matches: ~824

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check: notes

The automated check noted patterns worth knowing about, such as sudo or a known installer.

NoteMentions a .env fileSKILL.md:69

- 开发环境 `.env.development`：`VITE_API_PREFIX = '/mock'`

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from lin-97/gi-demo at commit d1e310a, republished under its Apache-2.0 licence (© lin-97). 137 words, ~824 tokens.

Download SKILL.mdSave it as .claude/skills/api-mock/SKILL.md (or your agent's skills folder).

name: api-mock
description: 在本模板项目中新增或修改 API 接口、类型定义与 vite-plugin-mock 模拟数据。涉及 getBaseApi、http、baseAPI、mock 目录、分页响应格式时使用。

API 与 Mock

接口层结构

每个业务模块一个文件，例如 src/apis/system/user.ts：

import { getBaseApi } from '@/apis/base'
import http from '@/utils/http'

export interface ListItem {
  id: string
  name: string
  status: Status
  createTime: string
  // ...
}

/** 标准 CRUD */
export const baseAPI = getBaseApi<ListItem>({ baseUrl: '/system/user' })

/** 非标准接口单独声明 */
export function getDictDataList(params: { code: string } & Pagination) {
  return http.get<PageRes<DictDataItem[]>>('/system/dict/getDictDataList', params)
}

getBaseApi 约定路径

方法	HTTP	路径
getList	GET	`{baseUrl}/getList`
getDetail	GET	`{baseUrl}/getDetail`
add	POST	`{baseUrl}/add`
update	POST	`{baseUrl}/update`
delete	POST	`{baseUrl}/delete`

列表参数：{ page, size, ...filters } 删除参数：{ ids: string[] }

响应格式

// 单条/布尔
interface ApiRes<T> {
  code: number
  data: T
  message: string
  success: boolean
}

// 分页列表 data 结构
interface PageRes<T> {
  records: T
  total: number
}

useTable 同时兼容 data 为数组或 PageRes 两种形态。

http 封装

实例：src/utils/http.ts，baseURL = import.meta.env.VITE_API_PREFIX
开发环境 .env.development：VITE_API_PREFIX = '/mock'
Token：请求头 token 字段（getToken()）
业务失败：success === false 时 Message/Notification 提示并 reject
401：跳转 /login

import http from '@/utils/http'

http.get<PageRes<Item[]>>('/path', { page: 1, size: 10 })
http.post<boolean>('/path', { ids: ['1'] })

Mock 开发流程

1. 静态数据

在 mock/_data/ 下维护 JSON/TS 数据，如 system_dict.ts。

2. 路由 Mock

在 mock/system/（或对应模块）新建文件：

import { defineMock } from '../_base'
import { getBaseApi, getDelayTime, resultError, resultSuccess } from '../_utils'

export default defineMock([
  ...getBaseApi({
    baseUrl: '/system/xxx',
    getListData: () => resultSuccess({ total: list.length, records: list }),
    getDetailData: (query) => {
      const obj = list.find((i) => i.id === query.id)
      return obj ? resultSuccess(obj) : resultError(null, '未找到', 400)
    }
  }),
  {
    url: '/system/xxx/customAction',
    method: 'get',
    timeout: getDelayTime(),
    response: ({ query }) => {
      // 筛选、分页后返回
      return resultSuccess({ total, records })
    }
  }
])

3. 工具函数

函数	用途
`resultSuccess(data)`	`{ code:200, success:true, data, message }`
`resultError(data, message, code?)`	失败响应
`getDelayTime()`	50–300ms 随机延迟
`getBaseApi({ baseUrl, getListData, ... })`	生成标准 CRUD mock

defineMock 会自动给 url 加前缀 /mock，与 VITE_API_PREFIX 对应。

4. 注册

确保 mock 文件被 mock/index 或同级聚合引入（遵循现有 mock/system/*.ts 模式）。

新增模块检查清单

src/apis/{module}/{name}.ts：类型 + baseAPI 或自定义方法
mock/{module}/{name}.ts：与接口路径一致
列表 Mock 返回 { total, records }
字段类型与 Status、Gender 等全局类型对齐
在页面通过 useTable({ listAPI, deleteAPI }) 接入

自定义 listAPI 示例

useTable({
  listAPI: (page) => getDictDataList({
    ...page,
    code: dictCode.value,
    name: query.name || undefined,
    status: query.status === '' ? undefined : query.status
  }),
  immediate: false
})

immediate: false 用于依赖左侧选中项后再 search() 的场景。

Files

Just SKILL.md in .agents/skills/api-mock of lin-97/gi-demo.

Open the folder on GitHubat commit d1e310a

Compare with similar skills

API Mock next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

API Mock compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
API Mock this skilllin-97/gi-demo	188	—	~824	Automated safety check: Notes	Apache-2.0	3 mo ago
Web Artifacts Builderanthropics/skills	180k	41 repos	~769	Automated safety check: Pass	Apache-2.0	2 days ago
React Router Developmentremix-run/react-router	57k	1 repos	~1.5k	Automated safety check: Pass	MIT	yesterday
Chakra UI v3 Builderchakra-ui/chakra-ui	41k	—	~3.1k	Automated safety check: Pass	MIT	yesterday
Vuetify Playgroundvuetifyjs/vuetify	41k	—	~730	Automated safety check: Pass	Custom licence	today
Creative Tim UI Blockscreativetimofficial/ui	12k	—	~2.1k	Automated safety check: Notes	MIT	6 mo ago

Similar skills

Web Artifacts Builder
anthropics/skills
Official
Builds multi-component claude.ai HTML artifacts as a small React, TypeScript and Tailwind project, then bundles it into one shareable HTML file.
180k GitHub starsUsed in 41 repos~769 tokens
Frontend & DesignAuto-check passed
React Router Development
remix-run/react-router
Guides work on React Router apps by first identifying whether the app uses Framework, Data or Declarative mode, then loading the matching reference and the installed package docs.
57k GitHub starsUsed in 1 repo~1.5k tokens
Frontend & DesignAuto-check passed
Chakra UI v3 Builder
chakra-ui/chakra-ui
Builds responsive, accessible Chakra UI v3 components and layouts, sets up Chakra in new or existing projects, and designs themes with tokens, semantic tokens and recipes.
41k GitHub stars~3.1k tokensUpdated yesterday
Frontend & DesignAuto-check passed
Vuetify Playground
vuetifyjs/vuetify
Maintains the Vuetify repo's local Playground.vue so contributors get a realistic reproduction and a short demo they can paste into a pull request description.
41k GitHub stars~730 tokensUpdated today
Frontend & DesignAuto-check passed
Creative Tim UI Blocks
creativetimofficial/ui
Helps install, generate and review Creative Tim UI blocks: shadcn/ui-based React and Tailwind sections that follow a restrained, production-minded design philosophy.
12k GitHub stars~2.1k tokensUpdated 6 mo ago
Frontend & DesignAuto-check: notes
Vitest
supabase/supabase
Official
Vitest API and config reference (Jest-compatible) — mocking with vi., spies, fake timers, coverage configuration, fixtures, snapshots, and test filtering.
111k GitHub starsUsed in 12 repos~1.1k tokens
Testing & QAAuto-check passed

Questions about API Mock

What does API Mock do?

在本模板项目中新增或修改 API 接口、类型定义与 vite-plugin-mock 模拟数据。涉及 getBaseApi、http、baseAPI、mock 目录、分页响应格式时使用。. API Mock is an agent skill from lin-97/gi-demo.

How do I install API Mock in Claude Code?

Run `npx skills add lin-97/gi-demo --skill api-mock -a claude-code`. Or copy the skill folder (.agents/skills/api-mock in lin-97/gi-demo) into .claude/skills/api-mock in your project. Claude Code loads it when a task matches its description.

How do I install API Mock in Codex?

Run `npx skills add lin-97/gi-demo --skill api-mock -a codex`. Or copy the skill folder (.agents/skills/api-mock in lin-97/gi-demo) into .agents/skills/api-mock in your project. Codex loads it when a task matches its description.

Can I use API Mock in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add lin-97/gi-demo --skill api-mock -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/api-mock, .gemini/skills/api-mock, .github/skills/api-mock and .opencode/skills/api-mock in your project.

What does API Mock need to run?

SKILL.md names no scripts, command-line tools or credentials: API Mock is instructions for the agent only.

Does API Mock access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is API Mock safe to install?

Our automated static check of SKILL.md found notes only (mentions a .env file), nothing it rates as a warning. It is not a guarantee. Review the folder before installing.

What licence does API Mock use?

API Mock is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does API Mock use?

About 824 tokens (SKILL.md is roughly 3.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to API Mock?

Skills that share tags, products or a category with API Mock: Web Artifacts Builder (anthropics/skills, 180k stars), React Router Development (remix-run/react-router, 57k stars), Chakra UI v3 Builder (chakra-ui/chakra-ui, 41k stars) and Vuetify Playground (vuetifyjs/vuetify, 41k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains API Mock?

lin-97 (a GitHub user) maintains it in lin-97/gi-demo, which has 188 GitHub stars. The repository holds 3 skills in this directory. The repository was last updated on June 12, 2026.

Source: lin-97/gi-demo on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

API Mock

Install API Mock

Facts

At a glance

What it does

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

API 与 Mock

接口层结构

getBaseApi 约定路径

响应格式

http 封装

Mock 开发流程

1. 静态数据

2. 路由 Mock

3. 工具函数

4. 注册

新增模块检查清单

自定义 listAPI 示例

Files

Compare with similar skills

Similar skills

Web Artifacts Builder

React Router Development

Chakra UI v3 Builder

Vuetify Playground

Creative Tim UI Blocks

Vitest

More from lin-97/gi-demo

Crud Page

Project

Questions about API Mock

Install API Mock

Facts

At a glance

What it does

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

API 与 Mock

接口层结构

getBaseApi 约定路径

响应格式

http 封装

Mock 开发流程

1. 静态数据

2. 路由 Mock

3. 工具函数

4. 注册

新增模块检查清单

自定义 listAPI 示例

Files

Compare with similar skills

Similar skills

More from lin-97/gi-demo

Related

Questions about API Mock