@devflow-tools/plugin-animation 0.8.9 → 0.8.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +26 -4
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @devflow-tools/plugin-animation
|
|
2
2
|
|
|
3
|
-
Animation
|
|
3
|
+
Animation 动画专家插件 — CSS 动画、Framer Motion、GSAP、Lottie、性能优化。
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
@@ -8,12 +8,34 @@ Animation expert plugin for DevFlow — CSS animations, Framer Motion, GSAP, Lot
|
|
|
8
8
|
npm install @devflow-tools/plugin-animation
|
|
9
9
|
```
|
|
10
10
|
|
|
11
|
+
## MCP Tools
|
|
12
|
+
|
|
13
|
+
| Tool | 说明 | 关键参数 |
|
|
14
|
+
|------|------|---------|
|
|
15
|
+
| `animation_audit` | 审计动画性能:检测非 GPU 加速属性、过度动画、`will-change` 缺失 | `projectRoot` |
|
|
16
|
+
|
|
17
|
+
## Knowledge Sources
|
|
18
|
+
|
|
19
|
+
| 来源 | URL | SPA |
|
|
20
|
+
|------|-----|-----|
|
|
21
|
+
| MDN CSS Animations | https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animations | No |
|
|
22
|
+
| MDN CSS Transitions | https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_transitions | No |
|
|
23
|
+
| Framer Motion | https://www.framer.com/motion | No |
|
|
24
|
+
|
|
25
|
+
## Memory
|
|
26
|
+
|
|
27
|
+
插件自动注入以下最佳实践:
|
|
28
|
+
- 动画属性只使用 `transform` 和 `opacity`(GPU 加速)
|
|
29
|
+
- 过渡动画 200-300ms,入场动画 300-500ms,复杂编排 < 1s
|
|
30
|
+
- 使用 `ease-out` 入场、`ease-in` 退场
|
|
31
|
+
- 尊重 `prefers-reduced-motion`,提供减弱动画方案
|
|
32
|
+
- 使用 `will-change` 提前创建 GPU 层
|
|
33
|
+
|
|
11
34
|
## Usage
|
|
12
35
|
|
|
13
36
|
```bash
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
# /devflow:animation 分析项目中的动画实现
|
|
37
|
+
# 在 Claude Code 中使用
|
|
38
|
+
/devflow:animation 审计首屏动画性能
|
|
17
39
|
```
|
|
18
40
|
|
|
19
41
|
## License
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@devflow-tools/plugin-animation",
|
|
3
|
-
"version": "0.8.
|
|
3
|
+
"version": "0.8.11",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -26,5 +26,5 @@
|
|
|
26
26
|
"files": [
|
|
27
27
|
"dist"
|
|
28
28
|
],
|
|
29
|
-
"gitHead": "
|
|
29
|
+
"gitHead": "a0a0b61377aa88ebbd380f50a5d532f63175ef45"
|
|
30
30
|
}
|