前端開源第三方UI框架有哪些？

很多前端開發(fā)的小伙伴們對于前端框架比較熟悉，但還不清楚前端框架具體有哪些，下面小編就來為小伙伴們總結一下吧！

1、bootstrap

Bootstrap 是Twitter推出的一個用于前端開發(fā)的，一個用于 HTML、CSS 和 JS 開發(fā)的開源工具包，是全球最受歡迎的前端組件庫，用于開發(fā)響應式布局、移動設備優(yōu)先的 WEB 項目。

官網(wǎng)：Bootstrap v4 中文文檔 · Bootstrap 是全球最受歡迎的 HTML、CSS 和 JS 框架，用于開發(fā)響應式布局、移動設備優(yōu)先的 WEB 項目。| Bootstrap 中文網(wǎng)

文檔：簡介 · Bootstrap v4 中文文檔 v4.6 | Bootstrap 中文網(wǎng)

2、Layui

layui（諧音：類UI

是一款采用自身模塊規(guī)范編寫的前端 UI 框架，遵循原生 HTML/CSS/JS 的書寫與組織形式，門檻極低，拿來即用。其外在極簡，體積輕盈，組件豐盈，非常適合界面的快速開發(fā)。layui 兼容人類正在使用的全部瀏覽器（IE6/7除外），可作為 PC 端后臺系統(tǒng)與前臺界面的速成開發(fā)方案。

官網(wǎng)：https://www.layui.com/

例子：https://www.layui.com/admin/std/dist/views/

3、MuseUI

Muse UI 基于 Vue2.0 開發(fā)，一套 Material Design 風格開源組件庫，旨在快速搭建頁面，擁有40多個UI 組件，提供了自定義主題，充分滿足可定制化的需求。

官網(wǎng)：Muse-UI

例子：https://muse-ui.org/#/zh-CN/

4、View UI

即原先的 iView，是一套基于 Vue.js 的開源 UI 組件庫，主要服務于 PC 界面的中后臺產品。特點：豐富的組件和功能，滿足絕大部分網(wǎng)站場景；提供開箱即用的 Admin 系統(tǒng) 和 高階組件庫；提供專業(yè)、優(yōu)質的一對一技術支持；細致、漂亮的 UI，可自定義主題。

官網(wǎng)：iView / View Design 一套企業(yè)級 UI 組件庫和前端解決方案

例子：https://www.iviewui.com/docs/introduce

5、jQueryUI

jQuery UI是在jQuery Javascript庫之上構建的一組精選的用戶界面交互，效果，小部件和主題。無論是構建高度交互的Web應用程序，還是只需要向表單控件添加日期選擇器，jQuery UI都是理想的選擇。

官網(wǎng)：jQuery UI

例子：jQuery UI Demos | jQuery UI

6、EasyUI

EasyUI是一種基于jQuery、Angular.、Vue和React的用戶界面插件集合。

jQuery EasyUI 提供易于使用的組件，它使 Web 開發(fā)人員能快速地在流行的 jQuery 核心和 HTML5 上建立程序頁面。

EasyUI for Angular是基于原生的Angular 5之上構建的，不需要其他外部Javascript庫。

官網(wǎng)：JQuery EasyUI中文網(wǎng)

例子：EasyUI 基礎面板

Basic Panel

_easyui demo

7、QuicK UI

QuicK UI 4.0 的組件庫包含了一百多種組件，一千多個應用場景示例，囊括了web開發(fā)的各種應用場景。組件的使用也都非常簡單，能讓你的開發(fā)效率提高N倍。

官網(wǎng)：http://www.uileader.com/product_quickui.html

例子：http://www.uileader.com/quickui/system/main/main.jsp

8、Element Ui

Element，一套為開發(fā)者、設計師和產品經(jīng)理準備的基于 Vue 2.0的桌面端組件庫。

官網(wǎng)：https://element.eleme.cn/#/zh-CN/

例子：https://element.eleme.cn/#/zh-CN/component/installation

9、At-UI

at-ui 是一個模塊化的前端 UI 框架，開發(fā)基于Vue.js 的快速和強大的 Web 界面。專門為桌面應用程序構建，AT-UI提供了一套 npm + webpack + babel 前端開發(fā)工作流程。它提供了一個體面的干凈整潔的 UI 組件。主要用于快速開發(fā) PC 網(wǎng)站中后臺產品。

官網(wǎng)：https://at-ui.github.io/at-ui/#/zh

例子：https://at-ui.github.io/at-ui/#/zh/docs/introduction

10、antd

antd 是基于 Ant Design 設計體系的 React UI 組件庫，主要用于研發(fā)企業(yè)級中后臺產品。開箱即用的高質量 React 組件，全鏈路開發(fā)和設計工具體系，數(shù)十個國際化語言支持。

官網(wǎng)：Ant Design - 一套企業(yè)級 UI 設計語言和 React 組件庫

例子：Ant Design of React - Ant Design

11、Material-UI

Material-UI是基于React 的UI框架，更快速、更簡便的 web 開發(fā)。官方市場中的高級主題——均以 Material-UI 為基礎。

官網(wǎng)：MUI: The React component library you always wanted

例子：安裝 - Material UI

12、Vant Weapp

Vant Weapp，是有贊前端團隊開發(fā)維護，是移動端 Vue 組件庫 Vant 的小程序版本，兩者基于相同的視覺規(guī)范，提供一致的 API 接口，助力開發(fā)者快速搭建小程序應用。

官網(wǎng)：https://youzan.github.io/vant-weapp/#/intro

例子：https://youzan.github.io/vant-weapp/#/intro

13、MiniUI

jQuery MiniUI - 專業(yè)WebUI控件庫。它能縮短開發(fā)時間，減少代碼量，使開發(fā)者更專注于業(yè)務和服務端，輕松實現(xiàn)界面開發(fā)，帶來絕佳的用戶體驗。

官網(wǎng)：jQuery MiniUI - 快速開發(fā)WebUI

例子：jQuery MiniUI V3.0 Demo

14、vuetify

官網(wǎng)：Vuetify — A Material Design framework for Vue.js

例子：Vuetify — A Material Design framework for Vue.js

15、BalmUI

官方網(wǎng)站：https://next-material.balmjs.com/#/

BalmUI 已經(jīng)發(fā)布了他們的 9.0 版本了，該版本支持Vue3。Balm 基于谷歌的 Material Design，這就是為什么它看起來很熟悉。Balm 附帶 Vue 插件和指令，以及從簡單到復雜的高度可定制的組件。

BalmUI 發(fā)展非常迅速，如果想使用 Material Design 風格，使用復雜的內置指令（如 debouncing 和 UI 波紋）在創(chuàng)建自定義組件時能派上用場，那么它非常適合 Vue3 項目。

16、Vuestic

官方網(wǎng)站：https://vuestic.dev/

Vuestic 是 Vue 最漂亮的開源管理面板之一，擅長編寫可維護的 Vue 代碼，制作靈活的組件和接口。

17、Ionic

官方網(wǎng)站：https://ionicframework.com/docs/vue/overview

18、Naive UI

官方網(wǎng)站：https://www.naiveui.com/zh-CN/os-theme

注意，naive-ui 僅支持 Vue3。如果你在使用 Vue2，可以去看看別的庫。

19、AXUI前端框架

官網(wǎng)：https://www.axui.cn/index.php

ax前端框架采用css3和html5標準，ax前端框架基于Javascript的es6版本開發(fā)。

20、Semi Design

官網(wǎng)：https://semi.design/zh-CN

Semi Design 是由抖音前端團隊，MED 產品設計團隊設計、開發(fā)并維護的設計系統(tǒng)。它作為全面、易用、優(yōu)質的現(xiàn)代應用 UI 解決方案，具有強大的主題化方案

以上就是培訓啦小編為大家整理的關于前端開源第三方框架了,希望對您有所幫助