weixin_38245947的博客

部署项目在 github 和 gitte。总结：组件库全量打包和按需打包。vitepress的搭建和使用。发布组件库到 npm。

日历组件当前并没有基于element-plus封装，而是找的第三方组件库fullcalendar封装的。// 在vite里面使用fullcalendar 需要引入一个包。// 自定义渲染内容方法。// 显示事件的结束时间。1.首先根据需要安装包。// 点击日历的某一天。// 点击日历上的时间。// 监听事件源的变化。// 日历显示的语言。// 生成日历的方法。// 日历的配置选项。// 自定义渲染内容。

src/index.tssrc/index.vueindex.ts

rules.tstypes.tssrc/index.vueindex.ts在项目中使用思路：1.将配置项定义为一个数组，对数组进行增加，删除的的操作2.将配置项定义rule时增加validator属性3.通过defineExpose暴露实例方法4.暴露 validateField 、 scrollToField 、 clearValidate 方法。表单组件配置项类型定义动态组件的使用插槽的使用处理上传组件集成富文本编辑器支持弹框嵌套defineExpose 新属性的使用

【代码】第4章 封装组件中级篇。

src/index.vueindex.tscomponents/index.ts注册2.list列表组件src/index.vuesrc/types.ts在components/index.ts中注册3.通知菜单src/index.vueindex.ts在components/index.ts中注册4.list（列表） + notification（通知）的使用data.tsindex.vue

2.添加端口号：3.安装路由4.代码main.tsApp.vue。

封装的组件有如下15个：图标选择器，省市区选择器，时间选择器，日期选择器，城市选择器，通知菜单，伸缩菜单，导航菜单，趋势标记，动态进度条，列表，表格，表单，弹框表单，日历。我们的目的不是做系统而是封装组件。本篇文件的价值：语法：vue3如何设计一个简单好用的组件。二次封装组件的思想与技巧。组合式使用现有组件。