基于ElementUI将input、select以及date-picker等组件进行封装，提升表单页面效率以及配置化

前言

随着业务增长越来越快，为了提高团队的开发效率，减少造轮子，部门领导希望搭建一个前端组件库，也方便沉淀前端业务组件物料。之前阅读过 element-ui 部分源码，很早之前希望搭建一个组件库，很开心的接下这个任务

技术栈

调研分析目前项目的诉求，有以下几点：

• 产品项目要兼容 IE
• 支持多主题换肤
• 配套文档 + demo
• 拥抱新技术、开发快
• ……

为了减少投入和维护成本，基于 element-ui 这个优秀的组件库进行开发是一个很不错的选择

项目技术栈：

• 文档和主题使用 vuepress ， vuepress-theme-hope
• 组件库 Vue 2.6+, 演示例子使用 Vue 2.7+
• CSS 自定义属性和 SCSS 变量 支持换肤
• Vite 3.2+ 开发环境
• rollup， gulp 打包构建项目

目录结构介绍

项目 目录结构使用 mddir 插件生成，目录结构介绍如下

|-- douluo-ui|-- .cz-config.js # cz-customizable commit message 规范|-- .editorconfig # EditorConfig 配置|-- .eslintignore # eslint 忽略检测文件|-- .eslintrc.js# eslint 配置文件|-- .gitignore# git 忽略提交|-- .ls-lint.yml# ls-lint 文件命名规范 kebab-case 校验|-- .stylelintignore# stylelint 忽略检测|-- .versionrc.js # standa……rd-version 自动生成 CHANGELOG 配置|-- CHANGELOG.md# standard-version 根据 commit 信息自动生成|-- README.md # readme 项目介绍|-- babel.config.js # babel 配置文件|-- commitlint.config.js# commitlint 校验 comit message 配置|-- compoments.json # 项目组件路径|-- components.d.ts # vite ts 文件类型声明|-- gulpfile.js # gulp 打包 css|-- index.html# vite 入口文件 /examples/main.js|-- jsconfig.json # js 配置文件|-- package.json|-- prettier.config.js# prettier 格式配置|-- stylelint.config.js # stylelint 格式配置|-- vite.config.js# vite 配置|-- .husky# husky 配置| |-- commit-msg# commit 提