从0搭建vue3组件库:Shake抖动组件( 二 ) _生活百科

这个单元测试的意思其实就是

slot传入Hello world,期望页面就会出现Hello world
props传入modelValue为true,那么组件就包含样式k-shakeactive

最后执行pnpm run coverage命令就会放下shake测试代码通过了

文章插图
导出打包发布这里和以往组件实现基本一样了，这里直接贴代码

shake/index.ts

import shake from './shake.vue'import { withInstall } from '@kitty-ui/utils'const Shake = withInstall(shake)export default Shake

src/index.ts

export { default as Button } from './button'export { default as Icon } from './icon'export { default as Link } from './link'export { default as Upload } from './upload'export { default as Shake } from './shake'最后执行
pnpm run build:kittypnpm run pnpm run build:kitty即可完成发布
写在最后组件库的所有实现细节可以关注公众号 web前端进阶获?。?包括环境搭建，自动打包发布，文档搭建，vitest单元测试等等。