Elyri介绍
了解 Elyri 的分区、包与两种使用方式。
#Elyri 是什么
Elyri 是一套面向 React 的组件集合：动效、基础 UI 组件与页面区块。每个组件都可以直接从 npm 包导入，也可以用 CLI 把源码拷进项目，像自己写的代码一样随意修改。
#分区与包
站点按分区组织，每个分区对应一个独立的 npm 包，只安装用得到的即可。
#两种使用方式
| 方式 | 适合 | 升级 |
|---|---|---|
| 从包导入 | 直接使用、不打算改源码 | 升级包版本即可 |
| CLI 拷贝源码 | 需要深度定制、想完全掌控实现 | 重新执行 add --overwrite（会覆盖本地修改） |
两种方式可以混用：大部分组件直接导入，个别需要改造的再拷出来。
#设计原则
- 零运行时依赖：只把
react与react-dom（18 或 19）作为 peer dependency。 - CSS 变量主题：可定制的值都是
--elyri-*变量，可在全局或任意容器内覆盖。 - 性能优先：WebGL 背景离开视口或页面切到后台时自动暂停，渲染分辨率默认不超过 2 倍像素比。
- 尊重减弱动效：自动跟随系统的「减弱动态效果」设置，也可以按子树强制播放或静止。