# @devflow-tools/plugin-vue

> Vue 3 专家插件 — Bug 诊断、Composition API、响应式调试、组件重构。（v0.17.8）

## 安装

```bash
npm install @devflow-tools/plugin-vue
```

## 使用

插件通过 DevFlow/Claude Code 使用：

```text
/devflow:vue <你的任务>
```

## 能力与知识源

## MCP Tools

| Tool | 说明 | 关键参数 |
|------|------|---------|
| `vue_diagnose_bug` | Bug 诊断：报错定位 → 响应式排查 → 修复验证 | `projectRoot`, `errorMessage`, `stackTrace` |
| `vue_new_component` | 新建 Vue 3 组件（`<script setup>` + TypeScript + 测试） | `projectRoot`, `componentName` |
| `vue_debug_reactivity` | 响应式调试：追踪数据流 → 定位问题 → 修复 | `projectRoot`, `targetFile` |

## Knowledge Sources

| 来源 | URL | SPA |
|------|-----|-----|
| Vue 3 官方文档 | https://vuejs.org/guide/introduction | No |
| Pinia 状态管理 | https://pinia.vuejs.org | No |

## Memory

插件自动注入以下最佳实践：
- `<script setup>` 优先于 Options API
- `ref` vs `reactive` 选择指南（基本类型用 ref，对象用 reactive）
- `defineProps`/`defineEmits` 类型安全模式
- 组合函数（composables）以 `use` 开头，返回 ref/reactive
- `watch`/`watchEffect` 自动清理避免内存泄漏


## 兼容性

需要 Node.js >= 18，并与同版本 @devflow-tools/sdk、DevFlow CLI 配合使用。插件不是独立 HTTP 服务。

## 相关链接

- [仓库](https://github.com/shilongfeicool/dev-flow)
- [插件目录](https://github.com/shilongfeicool/dev-flow/tree/main/plugins)

## License

MIT


## 兼容性

需要 Node.js >= 18，并与同版本 @devflow-tools/sdk、DevFlow CLI 配合使用。插件不是独立 HTTP 服务。

## 相关链接

- [仓库](https://github.com/shilongfeicool/dev-flow)
- [插件目录](https://github.com/shilongfeicool/dev-flow/tree/main/plugins)

## License

MIT


## 兼容性

需要 Node.js >= 18，并与同版本 @devflow-tools/sdk、DevFlow CLI 配合使用。插件不是独立 HTTP 服务。

## 相关链接

- [仓库](https://github.com/shilongfeicool/dev-flow)
- [插件目录](https://github.com/shilongfeicool/dev-flow/tree/main/plugins)

## License

MIT


## 兼容性

需要 Node.js >= 18，并与同版本 @devflow-tools/sdk、DevFlow CLI 配合使用。插件不是独立 HTTP 服务。

## 相关链接

- [仓库](https://github.com/shilongfeicool/dev-flow)
- [插件目录](https://github.com/shilongfeicool/dev-flow/tree/main/plugins)

## License

MIT