@sumdoo/element-plus

基于 Element Plus 扩展的组件库

Usage no npm install needed!

<script type="module">
  import sumdooElementPlus from 'https://cdn.skypack.dev/@sumdoo/element-plus';
</script>

README

介绍

该项目是基于 Element Plus 的扩展组件库

环境

  • Node >= 16+
  • pnpm >= 6.23.6

包结构

包名 描述
docs 组件库文档
play 组件使用测试
packages/element-plus 组件库安装入口
packages/components 所有组件
packages/theme 组件所有样式
packages/utils 工具函数目录

项目开发

项目基于 monrepo 结构、安装依赖区分 package 目录还是 root 目录

安装依赖

pnpm i

项目开发时安装依赖

  • 安装所有 packages 使用的依赖

    • 生产依赖 pnpm add libName -w
    • 开发依赖 pnpm add libName -w -D

  • 安装单个 packages 使用的依赖

    • 生产依赖 pnpm add libName --filter packages/packageName
    • 开发依赖 pnpm add libName --fitler packages/packageName -D

常用脚本命令

  • pnpm run clean:lib 清理 dist 目录
  • pnpm run clean 清理所有 packages 的 dist 目录
  • pnpm run dev 启用组件使用演示开发模式
  • pnpm run build 打包组件库
  • pnpm run build:theme 打包组件库样式
  • pnpm run docs:dev 组件文档开发模式
  • pnpm run docs:build 组件文档打包
  • pnpm run docs:serve 组件文档预览模式

提交规范

  • 常规提交文档
  • type: commit 的类型
  • feat: 新特性
  • fix: 修改问题
  • refactor: 代码重构
  • docs: 文档修改
  • style: 代码格式修改, 注意不是 css 修改
  • test: 测试用例修改
  • chore: 其他修改, 比如构建流程, 依赖管理.
  • scope: commit 影响的范围, 比如: route, component, utils, build...
  • subject: commit 的概述, 建议符合 50/72 formatting
  • body: commit 具体修改内容, 可以分为多行, 建议符合 50/72 formatting
  • footer: 一些备注, 通常是 BREAKING CHANGE 或修复的 bug 的链接.

待完成功能

  • 组件库文档搭建

    • 可交互查看源码
    • 支持中文、英语

  • 组件单元测试