项目介绍
在移动端优先的前提下模拟element UI 实现的个人UI组件库，包含了Button，Tabs等常用组件。
实现效果： nicey-lai.gitee.io/dida-ui/#/
源码链接： github.com/NiceyLai/Di…
学习收获
- 使用 Vite 打造官网，引入Vue Router ，封装了Topnav 组件，实现了手机页面适配
- 由于Vite1 bug太多，加上为了方便打包库文件，故而迁移到 Vite3
- 学习摸索并成功发布源码至 npm
- 自己设计并搭建官网
- 掌握了 Vue 3 Composition API
- 掌握了 Vite 开发与部署流程
- 掌握了TypeScript 最佳实践
- 掌握了Vue Router 4 的使用
技术体系
Vue3、VueRouter、Vite、Typescript
技术要点
- 使用provide和inject实现文档切换
- 使用媒体查询进行移动优先的适配
- 模拟element组件实现对不同插槽的实现
- 使用attribs实现对自定义属性的兼容
- 在保证组件基本交互功能的同时，阻止默认事件
- 使用TSX 代替Vue 中的template模板
