# Jinhui Stack Debug

> 网站和小程序调试的依赖关系排查指南。当调试陷入僵局时，Use this skill to systematically identify which dependency layer is causing the issue: (1) Data dependencies - verify backend before debugging frontend, (2) Environment differences - local vs production issues, (3) Version compatibility - library/framework mismatches, (4) Configuration errors - missing or incorrect configs, (5) State management - component/app state problems, (6) Network layer - CORS, timeouts, connectivity, (7) Permission/authorization - auth and access control, (8) Caching issues - stale code or data, (9) Build process - compilation and bundling problems, (10) Runtime environment - browser/platform differences.

- Skill: `lstm-kirigaya/jinhui-stack-debug` (Agent Skill, multi-file: 12 files)
- Install (CLI): `npx skillmds@latest add lstm-kirigaya/jinhui-stack-debug`
- Raw SKILL.md: https://api.skillmd.com/api/skills/lstm-kirigaya/jinhui-stack-debug/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: lstm-kirigaya (https://skillmd.com/u/lstm-kirigaya)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/lstm-kirigaya/jinhui-stack-debug

---

# Jinhui Stack Debug

> **Copyright © 锦恢 [kirigaya.cn](https://kirigaya.cn)**

网站和小程序调试的**依赖关系排查指南**。当调试陷入僵局时，按照此指南逐层排查，避免在低层级问题上浪费时间。

> **核心理念**：很多问题表象在前端，根源在依赖层。先验证依赖，再调试本体。

---

## 依赖类型目录

| 类型 | 路径 | 描述 |
|-----|------|-----|
| 数据依赖型 | [./data/DATA.md](./data/DATA.md) | 前端表现依赖于后端数据的正确性。页面显示异常时，先验证接口返回，再排查前端渲染。 |
| 环境依赖型 | [./environment/ENVIRONMENT.md](./environment/ENVIRONMENT.md) | 不同运行环境导致行为差异。本地正常但线上异常时，检查环境变量、域名、协议等差异。 |
| 版本依赖型 | [./version/VERSION.md](./version/VERSION.md) | 依赖库/框架版本不兼容。升级后功能异常时，检查版本变更和 breaking changes。 |
| 配置依赖型 | [./config/CONFIG.md](./config/CONFIG.md) | 配置文件错误或遗漏。白名单、API密钥、路由配置等问题。 |
| 状态依赖型 | [./state/STATE.md](./state/STATE.md) | 组件/应用状态管理问题。刷新后正常、切换页面后数据丢失等。 |
| 网络依赖型 | [./network/NETWORK.md](./network/NETWORK.md) | 网络层通信问题。请求超时、跨域报错、404/500 错误等。 |
| 权限依赖型 | [./permission/PERMISSION.md](./permission/PERMISSION.md) | 用户权限或接口权限不足。功能按钮不显示、接口返回 403 等。 |
| 缓存依赖型 | [./cache/CACHE.md](./cache/CACHE.md) | 各类缓存导致代码不生效。改代码后页面无变化、用户看到旧版本等。 |
| 构建依赖型 | [./build/BUILD.md](./build/BUILD.md) | 构建工具或产物问题。代码没生效、sourcemap 不匹配等。 |
| 运行时依赖型 | [./runtime/RUNTIME.md](./runtime/RUNTIME.md) | 浏览器/宿主环境差异。某浏览器正常某浏览器异常、iOS/Android 表现不一致等。 |

---

## 开发规范

| 类型 | 路径 | 描述 |
|-----|------|-----|
| 前端开发准则 | [./frontend-coding-standards/SKILL.md](./frontend-coding-standards/SKILL.md) | 前端组件开发规范。适用于 Vue、React、Next.js、Taro 等框架。组件函数与样式分离，文件行数控制（1000 行阈值），模块拆分与依赖迁移，提升复用性和健壮性。 |
| 测试集构建 | [./build-test-suite/SKILL.md](./build-test-suite/SKILL.md) | 软件测试集构建指南。项目初始化时检查测试集，遵循五大准则。 |
| 迭代习惯 | [./good-iteration-habits/SKILL.md](./good-iteration-habits/SKILL.md) | 良好的软件迭代习惯。测试优先、复用现有接口、功能影响评估、重构验证。 |
| 重构验证 | [./refactoring-with-verification/SKILL.md](./refactoring-with-verification/SKILL.md) | 重构 UI 时的功能完整性验证指南。截图记录、功能清单、前后对比，确保不丢失任何功能。 |
## Usage Examples

### Example 1

**User:**
我的小程序在本地运行正常，但上线后页面白屏了，请帮我按依赖关系逐层排查可能的原因。

**AI:**
我将根据你的请求，使用本 Skill 中的工具和调试流程来帮助你完成任务。

### Example 2

**User:**
前端页面显示的数据和预期不一致，请帮我分析是前端渲染问题还是后端接口数据问题。

**AI:**
我将根据你的请求，使用本 Skill 中的工具和调试流程来帮助你完成任务。