How to write internal UI Libraries for Vue
summary
Argues that wrapper components (facades) make apps more resilient by isolating third‑party scripts, component libraries and breaking changes; demonstrates using Vue lifecycle hooks, refs, slots, TypeScript and prop validation to wrap an intersection/scroll library, a button library and a promise component called NSYNCAwait; shows migrations shrinking to one place so consumers never change; reports a built, style‑less accessible library Vuetensils and recommends monorepos and the facade pattern to limit blast radius.
AI-written summary · about
chapters (9)
- 0:00Start
- 0:09Introduction
- 0:27Internal UI Libraries
- 2:01Scene 1, 3rd party scripts
- 4:49Scene 2, 3rd party component libraries
- 7:43Scene 3, redefining interfaces
- 11:49Scene 4, migrations
- 15:17Scene 5, closing
- 20:02Next steps
related talks
24mPatterns for Large Scale Vue.js Applications
31mBuilding Components for Vue 2&3 - an Attempt at solving the challenge
07mBuild Your Own Component Library, With `Shadcn-vue`
18mCreating a highly reusable VueJS Component library and publishing on NPM using @vue/cli 3.0
44mFrom Legacy to Vue.js
24mBuilding Backwards Compatible Vue Libraries
48mPatterns for Large Scale Vue JS Applications
28mExploring Vue3's Built-In Components