Vitest Testing
提供 Vitest 测试框架的模式与最佳实践指南
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：Vitest Testing。 它的用途是：提供 Vitest 测试框架的模式与最佳实践指南 完整的 Skill 内容见：https://321skill.com/skills/vitest-testing-x-5/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'我正在为一个使用 TypeScript 和 Vite 的 React 项目配置 Vitest，遇到了环境变量 mock 的问题，应该怎么处理？'，它会提供在 vitest.config.ts 中设置环境变量以及使用 vi.stubEnv 进行模拟的具体代码示例和最佳实践。或者，你可以问：'如何为一个使用了 axios 进行 HTTP 请求的 service 函数编写单元测试？'，它会指导你使用 vi.mock 模拟 axios 模块，并展示如何断言函数调用和返回结果。
介绍
本 Skill 旨在解决开发者在编写单元测试、集成测试以及配置 Vitest 时遇到的常见问题，提供经过验证的模式和最佳实践，帮助提升测试代码的质量和可维护性。
它通过提供具体的代码示例、配置模板和最佳实践建议来指导用户。例如，你可以询问如何为 Vue 3 组件编写测试，如何正确使用 vi.mock 进行模块模拟，或者如何配置 vitest.config.ts 以优化测试运行环境。
此 Skill 特别适合前端开发、全栈开发和测试工程师，尤其是那些正在或计划使用 Vitest 作为主要测试框架的开发者。无论是项目初期的测试框架选型，还是已有测试套件的优化，都能从中获得指导。
使用建议：建议在具体编码或配置遇到问题时，直接询问相关场景的实践方法。注意事项：本 Skill 聚焦于 Vitest 框架本身，对于特定 UI 库（如 React、Vue）的测试，可能需要结合其官方测试工具（如 Vue Test Utils）的文档共同使用。
核心特点
与通用的测试教程不同，本 Skill 深度聚焦于 Vitest 这一特定框架，提供了从基础配置到高级模拟（Mocking）的一站式解决方案，特别是对 vi.mock、vi.fn 等 Vitest 特有 API 的用法有详细指导。
注意事项
不适合需要学习其他测试框架（如 Jest、Mocha）或进行端到端（E2E）测试的场景。
常见问题
如何用 Vitest 测试一个 Vue 组件？
需要安装 @vue/test-utils，并使用 mount 或 shallowMount 渲染组件，然后结合 Vitest 的断言进行测试。
vi.mock 和 vi.fn 有什么区别？
vi.mock 用于模拟整个模块，vi.fn 用于创建模拟函数，常用于模拟模块中的单个方法或回调。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/vitest-testing-x-5/raw/index.md 读取 Vitest Testing 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/vitest-testing-x-5/raw/index.md（查看排版版本）