搭建vue3 & ts组件库脚手架 目标 pnpm搭建monorepo项目,和使用workspace测试组件库 组件支持typescript,可以被使用的项目识别 组件支持整体导入、按需自动导入 环境要求 node ≥ 18 , pnpm ≥ 8 , vue ≥ 3.3 初始化项目模板 首先
组件化是前端发展的一个重要方向,它一方面提高开发效率,另一方面降低维护成本。主流的 Vue.js、React 及其延伸的 Ant Design、uniapp、Taro 等都是组件框架。Web Components 是一组 Web 原生 API 的总称,允许我们创建可重用的自定义组件,并在我们 Web 应用中像使用原生
开源ui跨平台设计组件库 TDesign是一款诞生于腾讯内部、经过超500项内部业务检验的企业级设计体系,汇集了腾讯众多优秀组件库能力和设计研发经验。之前,TDesign已经支持 Vue2、Vue Next、React 等业界主流技术栈,方便使用者快速开发桌面端、移动端以及小程序等多个版本的应用程序。 腾讯开源 2023/12/09 1K0 腾讯开源企...
对于已有的小程序组件库,工具可视化新增展示能力。只需该组件库包处于 miniprogram_npm 目录下,且在组件库根目录下配置相应的配置文件接口 工具可视化即可解析和添加该组件库组件信息,使其可以拖拽到相应页面 wxml 和 json 中。 #运行环境 1.05.2206242或以上版本的开发者工具 ...
首先从业务目标出发,我们希望通过组件库实现三个核心目标:统一各个项目的设计规范、提高团队的开发效率、保证代码的质量标准。这些都是困扰我们团队已久的问题。 在技术层面,我们对组件库提出了严格的要求:必须有完整的 TypeScript 类型支持,确保类型安全;测试覆盖率要达到 100%,保证组件的可靠性;文档和示例要详细完整...
首先从业务目标出发,我们希望通过组件库实现三个核心目标:统一各个项目的设计规范、提高团队的开发效率、保证代码的质量标准。这些都是困扰我们团队已久的问题。 在技术层面,我们对组件库提出了严格的要求:必须有完整的 TypeScript 类型支持,确保类型安全;测试覆盖率要达到 100%,保证组件的可靠性;文档和示例要详细完整...
组件库开发完毕，我们是需要发布到 npm 上供其他人使用的，不然单独提出来的意义也不大，所以我们首先要做的的就是将 UI 组件库打包，这儿还是借助了 webpack，它专门有针对 library 进行设置。1、打包准备 这种方式是把所有相关的打包到 js 中，然后把样式单独抽离出来，形成 css 文件，最终你打包下来的目录就是...
组件库工程化概述 在必不可少的UI组件——组件库开发的基础知识(Vue篇)中,我们介绍了一些封装 Vue 组件的过程中高频使用到的框架技巧,但是,这并不足以支持我们实现完善的组件库。 建设一个成熟的组件库就像盖一幢大楼,工程化基础就如同脚手架一般,虽然不是组件库核心、必备的部分,但没有它们,整个施工过程就会充...
所以了解一个前端组件库最核心还是需要弄懂一个跑通背后所需要的各种准备工作,也就是上图中的第一根高柱,而开发一个组件库首先也应该专注于设计让至少一个跑通的方案。 Button 背后的技术链 我们以Naive UI[2]为研究对象,来详细剖析其实现背后的各种原理,原因有比较直观的 2 点: ...