tag 組件庫

標籤
貢獻11
89
09:43 AM · Nov 05 ,2025
opentiny 頭像 hui_61e3b3803b922 頭像 chengxuyuanyouyage 頭像 sihaihande 頭像 changlina 頭像 drem_meng 頭像 ntksol 頭像 ruochuan12 頭像 seu_duter 頭像 linyuyizhizou_678b9fdc436f1 頭像 jiangchuan_5ecf6be720834 頭像

@組件庫 / 博客 RSS 訂閱

opentiny 頭像

OpenTiny社區 - TinyVue：與 Vue 交往八年的組件庫

本文由體驗技術團隊莫春輝老師原創~ 去年因故停辦的 VueConf，今年如約在深圳舉行。作為東道主 上屆 VueConf 講師的我，沒有理由不來湊個熱鬧。大會結束後，我見裕波在朋友圈轉發 Jinjiang 的文章《我和 Vue.js 的十年》，我就在下面打趣道：“過兩年我也寫篇同名文章”，然後裕波回覆：“先寫一個我和 Vue 的八週年”。我尋思，我那十分鐘的閃電演講，有人吐槽沒有乾貨，比如同時支

vue.js , 組件庫 , 開源項目介紹 , 前端 , Javascript

收藏 評論

sihaihande 頭像

漢得數字平台 - Choerodon UI V1.6.7發佈！為 H-ZERO 開發注入新動能

引言 作為漢得 H-ZERO 開發平台的核心 UI 組件庫，Choerodon UI 始終以企業級場景的實際需求為導向，遵循語義化版本規範持續迭代，並支持平滑升級。 近日，Choerodon UI V1.6.7 正式發佈，版本迭代聚焦「高頻場景體驗優化」與「穩定性提升」，帶來30+核心功能升級、50+體驗細節優化及40+穩定性修復，從功能拓展、操作流暢度到系統可靠性全面提升，助力企業客户在數字化

組件庫 , 前端

收藏 評論

seu_duter 頭像

準時不早退機器貓 - HarmonyOS Next 高效開發模板與組件庫（20250730更新）| 鴻蒙應用開發必備資源 Part1（含開發案例）

華為官方-鴻蒙生態市場 鴻蒙生態市場為鴻蒙應用、元服務開發提供了豐富的模板與組件，極大提升了開發效率。本帖為大家總結分類一些常見的開發模板和組件，涵蓋各行業鴻蒙應用開發的常見場景，希望能幫到正在開發HarmonyOS Next應用的小夥伴們~ 1. 常見模板（HarmonyOS Next行業示例，點擊進入模板主頁） 首先為大家總結 HarmonyOS Next 高頻

組件庫 , 教程 , 模板 , 開發者 , harmonyos

收藏 評論

opentiny 頭像

OpenTiny社區 - TinyVue的DatePicker 組件支持日期面板單獨使用啦！

本文由體驗技術團隊劉坤原創。 現代 Web 開發中，日期選擇器是不可或缺的組件之一。無論是用户填寫表單、篩選數據，還是設置預約時間，日期選擇器都能提供便捷的操作體驗。然而，在某些場景下，我們可能需要將日期面板單獨使用，例如在彈窗、浮層或抽屜中展示，以提升用户體驗。 DatePicker 組件全新升級，支持日期面板單獨使用！無論您是需要在複雜頁面中嵌入日期選擇器，還是希望在特定場景下提供獨立的日期選

vue.js , 組件庫 , 開源 , 前端 , Javascript

收藏 評論

opentiny 頭像

OpenTiny社區 - TinyVue v3.17.0 正式發佈，推出了一款基於 Quill 2.0 的富文本編輯器，功能強大、開箱即用！

本文由體驗技術團隊Kagol老師原創~ 我們非常高興地宣佈，2024年6月26日，TinyVue發佈了v3.17.0🎉。 TinyVue 每次大版本發佈，都會給大家帶來一些實用的新特性，上一個版本我們重構了 chart-core，新增 CircleProcessChart 圓環進度圖等6個新的圖表組件，並增加了 Statistic 數據統計組件。 TinyVue 3.15.0 正式發佈，推

vue.js , 組件庫 , 開源項目介紹 , 前端 , Javascript

收藏 評論

chengxuyuanyouyage 頭像

程序員優雅哥 - 分享一個實用的 vite + vue3 組件庫腳手架工具，提升開發效率

無論是 vue2 全家桶還是 vue3 + vite + TypeScript，組件庫的使用幾乎大家都會，但自己開發一個獨立組件庫就不是每個人都掌握的，因為搭建組件庫的基礎開發環境，就會讓很多同學望而卻步。一個組件庫應該至少要包括三個方面： 組件庫的開發和打包； 組件庫文檔的開發和打包； 命令行工具 cli 快速創建新組件。 這幾天 程序員優雅哥 搭建了一個組件庫的基礎腳手架： vue3

腳手架cli , 組件庫 , vue-cli3 , vue3 , 前端

收藏 評論

opentiny 頭像

OpenTiny社區 - TinyVue 組件庫官網煥然一新！

本文由體驗技術團隊Kagol原創~ 之前有一些朋友吐槽我們 TinyVue 組件庫的 UI 不夠美觀，於是我們請了設計師小姐姐給我們的組件和網站進行優化，經過設計師小姐姐和我們的開發兄弟們一個多月的努力，終於完成網站第一版的優化。 優化點 主要優化點： 選項式和組合式寫法、單示例和多示例這兩個切換入口移到右下角，和主題切換放在一起，讓頁面整體上更加清爽 組件示例和 API 通過頁籤分開

vue.js , 組件庫 , 前端 , Web

收藏 評論

chengxuyuanyouyage 頭像

程序員優雅哥 - 開箱即用yyg-cli：快速創建 vue3 組件庫和vue3 全家桶項目

1 yyg-cli 是什麼 yyg-cli 是優雅哥開發的快速創建 vue3 項目的腳手架。在 npm 上發佈了兩個月，11月1日進行了大升級，發佈 1.1.0 版本：支持創建 vue3 全家桶項目和 vue3 組件庫項目。具體如下： vue3 全家桶項目 使用 yyg-cli 創建的 vue3 全家桶項目，底層基於優雅哥編寫的開源項目 vue3-vite-archetype，默認整合如下庫： -

腳手架cli , 組件庫 , vue-cli3 , vue3 , 前端

收藏 評論

chengxuyuanyouyage 頭像

程序員優雅哥 - Vue3 企業級優雅實戰 - 組件庫框架 - 9 實現組件庫 cli - 上

上文搭建了組件庫 cli 的基礎架子，實現了創建組件時的用户交互，但遺留了 cli/src/command/create-component.ts 中的 createNewComponent 函數，該函數要實現的功能就是上文開篇提到的 —— 創建一個組件的完整步驟。本文咱們就依次實現那些步驟。（友情提示：本文內容較多，如果你能耐心看完、寫完，一定會有提升） 1 創建工具類 在實現 cli 的過程中

vite , 組件庫 , vue3 , cli , 前端

收藏 評論

ruochuan12 頭像

若川 - 分析 vant4 組件庫源碼，寫一個 Vue3 highlight 高亮文本的組件

1. 前言 大家好，我是若川，歡迎關注我的公眾號：若川視野。我傾力持續組織了 3 年多每週大家一起學習 200 行左右的源碼共讀活動，感興趣的可以點此掃碼加我微信 ruochuan02 參與。另外，想學源碼，極力推薦關注我寫的專欄《學習源碼整體架構系列》，目前是掘金關注人數（5.8k+人）第一的專欄，寫有幾十篇源碼文章。 我們開發業務時經常會使用到組件庫，一般來説，很多時候我們不需要關心內部實現。

vue.js , vant , 組件庫 , 前端 , Javascript

收藏 評論

linyuyizhizou_678b9fdc436f1 頭像

小帆聊前端 - Vue3 組件庫深度解讀：從開發到發佈，打造企業級可複用組件生態

Vue3 組件庫深度解讀：從開發到發佈，打造企業級可複用組件生態 前言：組件庫開發的那些 “血淚坑” “為什麼封裝的組件在不同項目中樣式衝突？” “組件 props 設計混亂，使用者不知道該傳什麼？” “函數式調用組件（如 Message）怎麼實現掛載與銷燬？” “打包後體積臃腫，按需引入失效？” “發佈到 npm 後，別人安裝了卻用不了？” 組件庫是前端工程化的核心產物 —— 它能解決 “重複造

vue.js , 組件庫 , 前端 , Javascript

收藏 評論

hui_61e3b3803b922 頭像

xachary - 基於 CSS Grid 的簡易拖拉拽 Vue3 組件，從代碼到NPM發佈（1）- 拖拉拽交互

基於特定的應用場景，需要在頁面中以網格的方式，實現目標組件在網格中可以進行拖拉拽、修改大小等交互。本章開始分享如何一步步從代碼設計，最後到如何在 NPM 上發佈。 請大家動動小手，給我一個免費的 Star 吧~ 大家如果發現了 Bug，歡迎來提 Issue 喲~ github源碼 示例地址 文檔 特別説明一下，此組件是基於 CSS 的 display: grid 的，並非全能型拖拉拽

組件庫 , vue3 , 拖拽 , typescript , 前端

收藏 評論

opentiny 頭像

OpenTiny社區 - 有獎問卷調研|OpenTiny給你送天命人好禮啦！

破防了！家人們！ 參與這個活動到底有多簡單？ 加入OpenTiny開源社區 ，到底是種什麼樣的體驗？ 原來，使用項目不僅有社羣技術答疑， 還能送緊箍咒等天命人好禮！ 班味太濃，是時候該去去班味了~ 這個活動，就等你來參加啦~ 活動説明：有獎問卷調研！！！ 現在起至9月20日，填寫你對於 OpenTiny 項目的真實使用情況，我們會根據問卷內容，針對填寫優質問卷的小夥伴贈送相應禮物~ 友好用户

vue.js , 組件庫 , 低代碼 , typescript , 前端

收藏 評論

sihaihande 頭像

漢得數字平台 - H-ZERO前端開發：編輯組件選型實用指南！

一、引言 編輯組件作為 H-ZERO 前端生態中的核心組件之一，其選型直接關係到開發效率和產品質量。面對前端開發中編輯組件的多樣選擇。本文將為您揭示 H-ZERO 項目中編輯組件選型思路，幫助您輕鬆應對選型挑戰！ 二、富文本編輯 H-ZERO 前端團隊提供了兩種適用於不同場景的富文本編輯組件： NewRichTextEditor：基於 Quill 2.x 封裝，具有輕量級、易於擴展，功能全面且適

組件設計 , 組件庫 , 前端

收藏 評論

hui_61e3b3803b922 頭像

xachary - 基於 CSS Grid 的簡易拖拉拽 Vue3 組件，從代碼到NPM發佈（2）- NPM發佈、在線示例

這裏分享一下本開源項目是如何構建組件庫及其如何發佈到NPM上的，還有組件庫與在線示例的構建有什麼差異。 請大家動動小手，給我一個免費的 Star 吧~ 大家如果發現了 Bug，歡迎來提 Issue 喲~ github源碼 NPM 示例地址 文檔 版本更新信息 拖動 調整大小 拖入 嵌套 有限的嵌套 關於構建 與構建有關的文件，主要有： └─ dist - 構建的組件

組件庫 , vue3 , 拖拽 , typescript , 前端

收藏 評論

chengxuyuanyouyage 頭像

程序員優雅哥 - Vue3 企業級優雅實戰 - 組件庫框架 - 8 搭建組件庫 cli

前面的文章分享了組件庫的開發、example、組件庫文檔，本文分享組件庫 cli 開發。 1 為什麼要開發組件庫 cli 回顧一個新組件的完整開發步驟： 1 在 packages 目錄下創建組件目錄 xxx： 1.1 使用 pnpm 初始化 package.json，修改 name 屬性； 1.2 在該目錄中創建 src 目錄和 index.ts 文件； 1.3 在 src 目錄下創建 types

vite , 組件庫 , vue3 , cli , 前端

收藏 評論

jiangchuan_5ecf6be720834 頭像

蔣川 - 7 款最棒的 React 移動端 UI 組件庫 - 特別針對國內使用場景推薦

本文完整版：《7 款最棒的 React 移動端 UI 組件庫 - 特別針對國內使用場景推薦》 優秀的 React UI 移動端組件庫和模版框架，幫我們節省開發時間，提高開發效率，統一設計語言。更棒的是內置的功能複雜，我們自己很難處理的常用組件，比如表格、表單、富文本編輯器、時間日期選擇器、實時拖拽組件等，再進一步，還有幫我們把組件的輪子裝好的 React admin 後台管理系統。本文推薦 7 款

react , 前端框架 , 組件庫 , 移動端web , 前端

收藏 評論

opentiny 頭像

OpenTiny社區 - 不止按鈕和表格！TinyVue 偷偷上線 Space 組件，直接搞定「彈性+間距」佈局

本文由TinySpace組件貢獻者夏雯斐同學原創。 前言 近期，TinyVue正式發佈 v3.27.0版本，這次版本更新也增加了很多新特性，space組件就是其中比較重要的一個特性。 Space組件 是 OpenTiny Vue組件庫中的一個佈局容器組件，用於在子元素之間提供靈活的間距控制。 它支持水平與垂直方向排列、自動換行、對齊與分佈控制、以及順序調整等功能，能幫助開發者輕鬆實現響

vue.js , 組件庫 , 前端

收藏 評論

opentiny 頭像

OpenTiny社區 - 產品經理要“通過大小、時間範圍篩選”搜索？我 15 分鐘用 SearchBox 交差！

本文由體驗技術團隊陳家梅原創。 我不太喜歡嚴肅的表達，所以本文描述比較個人化，也希望大家可以放鬆，跟隨本文的思路聯想起來。 好了，瞭解一個東西離不開哲學三問：是什麼？怎麼來的？用來幹什麼？所以主要從這三方面展開描述， 我們將詳細介紹 TinyVue 組件庫的searchBox組件的功能特性。 這裏建議大家進入 SearchBox 文檔地址，跟着本文操作效果更佳，文檔地址：https://op

vue.js , 組件庫 , 開源 , 前端

收藏 評論

opentiny 頭像

OpenTiny社區 - OpenTiny訓練營實操體驗|輕鬆解鎖TinyVue智能組件開發Web應用

1.背景描述 TinyVue 是一套企業級的 Vue 框架下的組件庫，它具有跨端、跨框架的特性，同時支持 Vue2 和 Vue3，支持 PC 端和移動端瀏覽器。 本次實驗是通過改造一個使用 TinyVue 組件的常規 Web 應用，秒變為一個能夠對接大語言模型的智能應用。這個應用可以讓用户通過自然語言與網頁進行對話，直接“精準”操作網頁上的組件。 2.實驗簡介 首先，我們提供了一個用 Vue3 搭

vue.js , 組件庫 , 前端

收藏 評論

opentiny 頭像

OpenTiny社區 - 直播預告：TinyVue 組件庫實戰解析，提升組件庫構建技能！

在複雜的編碼世界裏，大家總希望能夠尋找更高效、更簡潔的解決方案來優化工作流程，提升開發效率。在5月28日晚7點 OpenTiny B站直播間，OpenTiny 非常榮幸地為大家帶來一場關於 TinyVue 組件庫實戰分享的直播。屆時，TinyVue 組件庫成員阿健老師將與大家深入探討 TinyVue 組件庫的關鍵技術，同時針對開發者對 TinyVue 組件庫提出的相關問題做出詳細解答，幫助開發者更

vue.js , 組件庫 , web開發 , 前端 , Javascript

收藏 評論

opentiny 頭像

OpenTiny社區 - OpenTiny Vue 組件庫適配微前端可能遇到的4個問題

本文由體驗技術團隊 TinyVue 項目成員岑灌銘同學創作。 前言 微前端是一種多個團隊通過獨立發佈功能的方式來共同構建現代化 web 應用的技術手段及方法策略，每個應用可以選擇不同的技術棧，獨立開發、獨立部署。 TinyVue組件庫的跨技術棧能力與微前端十分契合，往期我們也有文章，指導如何在wujie微前端中使用TinyVue組件庫，文章鏈接：https://mp.weixin.qq.com/s

vue.js , 組件庫 , 開源 , 微前端 , 前端

收藏 評論

sihaihande 頭像

漢得數字平台 - H-ZERO富文本組件又上新啦！新增快速創建表格和配置文件封面，快來使用吧！

01 引言 H-ZERO 平台團隊始終專注於開發高效的前端工具組件，通過對 CKEditor4 的深度封裝與創新拓展，為企業用户提供更強大、更貼合業務需求的富文本解決方案。 最近，我們收到了不少項目的真實反饋，集中在這幾個痛點： 關於大家關心的 “是否升級 CKEditor5”：我們調研後發現，CKEditor5 採用 GPL 2+ 開源許可證，該條款要求所有衍生產品必須開源 ——

組件庫 , 前端

收藏 評論

opentiny 頭像

OpenTiny社區 - TinyVue 智能組件庫：基於 MCP 協議，實現 AI 代替人操作 Web 組件

本文由體驗技術團隊 Kagol 原創。 2025年6月21日，我在華為開發者大會2025（HDC2025）開源論壇做了一場主題分享，給開發者們介紹我們 OpenTiny 團隊基於 MCP 協議實現 AI 代替人操作 Web 組件的技術。 傳統的 Web 應用都是由人來操作的，用户需要學習幫助文檔，操作成本相對較高，如果能讓 AI 來幫我們操作，我們只需要在關鍵節點進行確認的動作即可，是不是就非常

vue.js , 組件庫 , 前端

收藏 評論