业务组件库开发流程

简介: 业务组件库可以帮助我们加速开发流程,提高工作效率,提升代码复用率

业务组件库必要性

项目经过长期维护之后往往会沉淀出很多公共组件,当一个组件编写完成之后,其他维护者想要使用这个组件,了解这个组件是做什么的,应该怎么用,必须再去翻看源码,或者没有压根儿注意到这个组件导致重发开发。这个时候一个完善的组件库就很有必要了,可以保障开发者之间进行良好的协作。

组件库可以帮我们解决以下问题:

  • 业务组件跨项目复用,提升开发效率
  • 统一代码实现,统一代码质量保障
  • 组件库文档提供清晰的使用方式和直观的展示效果

组件库的组成

业务组件构成

业务组件库是基于基础组件库进行编写的,基础组件库是使用公司的antd。我们会对基础组件针对不同需求进行封装,达到可以直接引用无需二次开发的目的(比如:产线下拉选择组件,我们会将接口请求数据、选项模糊查询、多语言等封装到组件内部,无需二次开发,接口请求也不需要再散落到各个页面中)。

目标

  1. 引⼊即可使⽤,⽆需⼆次开发
  2. 完善的文档和组件效果演示,支持代码一键拷贝
  3. 良好的代码质量:使用Jest进行单元测试,保障代码质量
  4. 良好的编码规范和代码提交规范:ESLint、Husky、commit-lint等工具进行校验和拦截
  5. 根据代码提交自动生成ChangeLog
  6. 组件效果演示支持编辑实时渲染(在文档中编辑组件,实时变更展示效果)

开发计划

组件库开发周期

  1. 准备

    • 组件库文档选型评审
    • 首批组件梳理
  2. 开发

    • 基础架构设计

      • 目录结构规范
      • 本地开发环境构建
      • 代码规范校验
      • 代码提交规范校验
      • CR和发布规范
      • TypeScript支持
    • 单元测试

      • Jest + @testing-library
    • 组件开发
    • 组件库文档生成

      • 本地预览调试
      • 本地构建
  3. 初次发布

    • 发布和使用初次版本
  4. 迭代升级

    • 业务组件新增
    • 业务组件迭代
    • 组件库文档托管

      • 在线访问
  5. 可视化构建页面区块和页面

业务组件库完成之后,就可以尝试低代码了,可以使用拖拽或者图像识别自动生成业务代码

混沌前端

相关文章
|
8月前
|
前端开发 JavaScript jenkins
构建高效前端项目:从模块化到自动化
【2月更文挑战第13天】 随着Web技术的不断进步,前端项目的复杂性日益增加。为了确保可维护性和性能,前端工程师必须采用模块化和自动化的策略来优化开发流程。本文将探讨如何使用现代前端工具和最佳实践来构建一个高效的前端项目架构,包括模块打包、代码分割和持续集成等方面。
|
前端开发 JavaScript API
构建可重用用户界面:深入了解组件库的价值与实践
在现代应用程序开发中,组件库已经成为加速开发和提高代码质量的利器。它们是可重用的UI构建块,可以帮助开发者创建一致、漂亮和功能强大的用户界面。本博客将深入研究组件库的核心概念、最佳实践以及为什么它们对于现代开发至关重要。
106 0
|
测试技术
|
24天前
|
开发框架 人工智能 安全
Promptic:轻量级 LLM 应用开发框架,提供完善的底层功能,使开发者更专注于构建上层功能
Promptic 是一个轻量级的 LLM 应用开发框架,支持通过一行代码切换不同的 LLM 服务提供商。它提供了类型安全的输出、流式支持、内置对话记忆、错误处理和重试等功能,帮助开发者专注于构建功能,而不是底层的复杂性。
68 6
Promptic:轻量级 LLM 应用开发框架,提供完善的底层功能,使开发者更专注于构建上层功能
|
5月前
|
安全 前端开发 Java
随着企业应用复杂度提升,Java Spring框架以其强大与灵活特性简化开发流程,成为构建高效、可维护应用的理想选择
随着企业应用复杂度提升,Java Spring框架以其强大与灵活特性简化开发流程,成为构建高效、可维护应用的理想选择。依赖注入使对象管理交由Spring容器处理,实现低耦合高内聚;AOP则分离横切关注点如事务管理,增强代码模块化。Spring还提供MVC、Data、Security等模块满足多样需求,并通过Spring Boot简化配置与部署,加速微服务架构构建。掌握这些核心概念与工具,开发者能更从容应对挑战,打造卓越应用。
50 1
|
2月前
|
传感器 前端开发 Android开发
在 Flutter 开发中,插件开发与集成至关重要,它能扩展应用功能,满足复杂业务需求
在 Flutter 开发中,插件开发与集成至关重要,它能扩展应用功能,满足复杂业务需求。本文深入探讨了插件开发的基本概念、流程、集成方法、常见类型及开发实例,如相机插件的开发步骤,同时强调了版本兼容性、性能优化等注意事项,并展望了插件开发的未来趋势。
46 2
|
8月前
|
算法 测试技术 数据处理
【C++ 设计思路】优化C++项目:高效解耦库接口的实战指南
【C++ 设计思路】优化C++项目:高效解耦库接口的实战指南
208 5
|
8月前
|
前端开发 JavaScript 测试技术
构建高效前端项目:模块化与组件化策略
【2月更文挑战第25天】 在现代网页开发中,随着用户对于网页性能和交互体验的期待不断提升,前端项目的复杂性也随之增加。为了应对这种复杂性并提高开发效率,本文将探讨模块化与组件化在前端项目中的应用策略。通过分析这两种方法的优势与适用场景,我们将揭示如何利用它们来优化项目结构,提升代码复用率,以及加快开发流程。
162 4
|
8月前
|
资源调度 前端开发 JavaScript
构建高效前端项目:模块化与组件化的最佳实践
【2月更文挑战第13天】在现代前端开发的浪潮中,模块化和组件化已经成为提升项目可维护性和开发效率的核心原则。本文深入探讨了如何通过合理的模块划分、组件设计以及工具选择来优化前端项目结构,同时确保代码的复用性和可测试性。我们将从理论出发,结合实例分析,为前端开发者提供一套行之有效的最佳实践指南。
335 0
|
容器
【系统架构】组件与(模块化和应用集成)的区别
【系统架构】组件与(模块化和应用集成)的区别
350 0