# @devflow-tools/plugin-css

> CSS 专家插件 — 布局调试、响应式审查、BEM 规范、性能优化。（v0.17.8）

## 安装

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

## 使用

插件通过 DevFlow/Claude Code 使用：

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

## 能力与知识源

## MCP Tools

| Tool | 说明 | 关键参数 |
|------|------|---------|
| `css_audit_selectors` | 审计 CSS 选择器：检测特异性问题、`!important` 滥用、命名规范 | `filePath`, `projectRoot` |

## Knowledge Sources

| 来源 | URL | SPA |
|------|-----|-----|
| MDN CSS 参考 | https://developer.mozilla.org/en-US/docs/Web/CSS | No |
| web.dev Learn CSS | https://web.dev/learn/css | No |

## Memory

插件自动注入以下最佳实践：
- Flexbox/Grid 优先于 float/absolute 定位
- CSS 变量统一管理主题色和间距
- 选择器特异性控制（最多 3 级嵌套，避免 `!important`）
- BEM 命名约定提高可维护性
- 动画使用 `transform` 和 `opacity`（GPU 加速）


## 兼容性

需要 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