SuperAPI AI 工具集

syncfusion-ej2-react-to-pure-react-migration-skill

编程与开发

查看项目

更新于 10-16 06:14

技能介绍

用途:把应用从 Syncfusion EJ2 React 迁移到 Syncfusion Pure React。可用前提:Pure React 组件从 Syncfusion v29.2.4 起提供,独立主题包需 v34.1.29 或更高;只有已发布的子集组件可迁移,未列出的组件暂不能仅用 Pure React 迁移。

主要规则与能力:

  • 组件命名:去掉 EJ2 类的 Component 后缀得到 Pure React 标识,部分组件根名有变化,例如 AutoCompleteComponent→<Autocomplete>、GridComponent→<Grid>、ScheduleComponent→<Scheduler>、AccumulationChartComponent→<PieChart>;已无后缀的(如 <Form>、<Menu>)保留原名。具体以组件参考文件为准。
  • 组合方式:EJ2 的 <XDirective> / <XCollectionDirective> 由专用子组件组合替代;<Inject services={[...]} /> 直接删除,改用根组件上的 *Settings / *Settings={{ enabled }} 属性。
  • 包名:@syncfusion/ej2-react-<area> 改为 @syncfusion/react-<area>,部分末段有变,如 ej2-react-grids→react-grid、ej2-react-schedule→react-scheduler;未列出的包尚未发布。
  • 许可证:代码注册由 @syncfusion/ej2-base 的 registerLicense 改为 @syncfusion/react-base 的 registerLicense,在渲染前调用一次;CLI 由 npx syncfusion-license activate 改为 npx syncfusion-react-license activate;syncfusion-license.txt 与 SYNCFUSION_LICENSE 不变。
  • 主题:仅支持 material、tailwind、bootstrap,旧主题无对应版本;需移除所有 @syncfusion/ej2-*-theme 导入,改用组件级或主题全局 CSS 导入,迁移后需目视检查。
  • 图标:由 @syncfusion/ej2-icons 的 CSS 类字符串改为 @syncfusion/react-icons 的 React 模块组件。
  • 共享约定:事件处理加 on 前缀;locale、RTL、currencyCode、ripple、animate 上移到 <Provider>(来自 @syncfusion/react-base),其中 enableRtl 改为 dir="rtl";类引用改为 useRef<T>(null);created/destroyed 与 destroy() 改用 useEffect。
  • 工作流:读取 references/<componentName>.md 迁移规范,应用映射,生成代码,编译;编译失败时若映射在参考文件中则修正,否则检查 node_modules 并回填映射。版本只需比较主版本:组件需 v29 以上,独立主题包需 v34 以上,次版本差异可接受。

限制:组件属性的具体改名、事件、方法、枚举、模板与命令式 API 名称必须查阅对应组件参考文件,SKILL.md 不重复这些细节;每个组件的参考文件是权威来源。未提供更细的组件级参数、平台支持范围与效果说明。