前端開源項(xiàng)目下載網(wǎng)站集
前端框架
Vue.js
主流前端框架
官網(wǎng)地址:https://cn.vuejs.org/](https://cn.vuejs.org/
直接使用
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
全局安裝
npm install vue
Express
Express
是一個(gè)簡潔而靈活的 node.js Web應(yīng)用框架, 提供了一系列強(qiáng)大特性幫助你創(chuàng)建各種 Web 應(yīng)用筋帖,和豐富的 HTTP 工具奠骄。
官網(wǎng)地址:https://www.expressjs.com.cn/
全局安裝express-generator
npm install express --save
系統(tǒng)組件
1彼妻、iView后臺系統(tǒng)組件庫
基于vue開的的vue的Ui組件庫
官網(wǎng)地址:https://iviewui.com/
js引入
<!-- import Vue.js -->
<script src="http://vuejs.org/js/vue.min.js"></script>
<!-- import stylesheet -->
<link rel="stylesheet" >
<!-- import iView -->
<script src="http://unpkg.com/view-design/dist/iview.min.js"></script>
全局安裝
npm install view-design --save
2攀隔、Element Ui 后臺系統(tǒng)組件庫
餓了么公司基于vue開發(fā)的vue的Ui組件庫
Element Ui 基于vue pc端的UI框架
官網(wǎng)地址:https://element.eleme.cn/#/zh-CN
全局安裝
npm i element-ui -S
MintUi 基于vue的移動端的ui框架
官網(wǎng)地址:http://mint-ui.github.io/#!/zh-cn
安裝
// 安裝
# Vue 1.x
npm install mint-ui@1 -S
# Vue 2.0
npm install mint-ui -S
3原献、layui后臺系統(tǒng)組件庫
是一款后臺系統(tǒng)組件庫
官網(wǎng)地址:http://www.ydui.org/
全局安裝:
npm i layui-src
4、ydui.js 移動端&微信UI組件庫
YDUI JS組件基于jQuery 2.0+開發(fā)的澜汤,移動端&微信UI組件庫
官網(wǎng)地址:http://www.ydui.org/
特點(diǎn):聯(lián)動樣式不錯(cuò)
CDN引入
【使用rem】:
<!-- 使用rem稠诲,需另外引入ydui.flexible.js自適應(yīng)類庫 -->
<link rel="stylesheet" >
<script src="http://unpkg.com/vue-ydui/dist/ydui.flexible.js"></script>
<!-- 引入Vue2.x -->
<script src="http://vuejs.org/js/vue.min.js"></script>
<!-- 引入組件庫 -->
<script src="http://unpkg.com/vue-ydui/dist/ydui.rem.js"></script>
【使用px】:
<!-- 使用px -->
<link rel="stylesheet" >
<!-- 引入Vue2.x -->
<script src="http://vuejs.org/js/vue.min.js"></script>
<!-- 引入組件庫 -->
<script src="http://unpkg.com/vue-ydui/dist/ydui.px.js"></script>
全局安裝
npm install vue-ydui --save
5、WeUI 移動端 UI 組件庫
騰訊公司開發(fā)的專為微信設(shè)計(jì)的 UI 庫 WeUI
https://weui.io/
開發(fā)文檔:http://old.jqweui.com/components
js文檔: https://github.com/Tencent/weui.js/blob/master/docs/README.md
github: https://github.com/Tencent/weui.js
菜鳥教程:http://www.runoob.com/w3cnote/weui-for-weixin-web.html
效果展示: https://weui.io
6飒炎、VUX 移動端 UI 組件庫
VUX 是基于 WeUI 和 Vue.js 的 移動端 UI 組件庫
官網(wǎng)地址:https://vux.li/
示例地址:https://vux.li/demos/v2/#/demo
7埋哟、Materialize-UI 移動端 UI 組件庫
官網(wǎng)地址:http://www.materializecss.cn/
8、Amazeui
Amaze UI 是一個(gè)輕量級厌丑、 Mobile first 的前端框架, 基于開源社區(qū)流行前端框架編寫的定欧。
官網(wǎng)地址:http://amazeui.shopxo.net
演示地址:http://amazeui.clouddeep.cn/examples/admin-index.html
后臺系統(tǒng)UI集成
1、iview-admin
iview開發(fā)的基于vue 的后臺系統(tǒng)UI集成包
github地址:https://github.com/iview/iview-admin
預(yù)覽地址:http://admin.iviewui.com/login
2怒竿、vue-element-admin
餓了么公司基于vue開發(fā)的后臺系統(tǒng)UI集成
官網(wǎng)地址:https://panjiachen.github.io/vue-element-admin-site/zh/
github地址:https://github.com/PanJiaChen/vue-element-admin
預(yù)覽地址:https://panjiachen.github.io/vue-element-admin/#/login?redirect=%2Fdashboard
圖表圖繪制
ECharts 圖表
官網(wǎng)地址:http://echarts.apache.org/zh/index.html
wx-charts小程序圖表插件:
工具類
firebug一抓包
菜鳥教程地址:https://www.runoob.com/firebug/firebug-tutorial.html
Vue在線代碼編輯器插件 vue-monaco-editor
require.js模塊載入框架
npm之前的包加載方式砍鸠,使用npm后這個(gè)也逐漸被代替了
官網(wǎng)地址:https://requirejs.org/
思維導(dǎo)圖軟件 mindmaster
旗下還有
Edraw Project 項(xiàng)目管理軟件
MindMaster 思維導(dǎo)圖軟件
數(shù)據(jù)處理
redis 開源地址:https://github.com/tporadowski/redis/releases
redis 包集合地址:http://download.redis.io/releases/
mock 數(shù)據(jù)
mockjs
生成隨機(jī)數(shù)據(jù),攔截 Ajax 請求
http://mockjs.com/
easy-mock
它是模擬真真實(shí)實(shí)的api請求數(shù)據(jù)耕驰,并允許任何跨域請求爷辱。
https://easy-mock.com
其他
vuex:是一個(gè)專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理模式。
vue-router:一般單頁面應(yīng)用spa都要用到的前端路由朦肘。
moment:時(shí)間日期處理類庫格式
npm install moment --save
vue-quill-editor:一款優(yōu)秀的富文本編輯器
npm install vue-quill-editor --save
mavon-editor:一款Markdown編輯器
npm i mavon-editor
jwt-decode用于解析token
https://github.com/auth0/jwt-decode/
axios
http://www.axios-js.com/(vue 推薦 的異步通信)
Administrative-divisions-of-China 中華人民共和國行政區(qū)劃(五級)(2019-2020)
https://github.com/modood/Administrative-divisions-of-China
vue-devtools vue調(diào)試工具
github:https://github.com/vuejs/vue-devtools
jqueryui
基于jQuery的組件庫饭弓,我覺得它最好的地方在于表單拖動,可視化排列
https://www.jqueryui.org.cn/
Mockplus 項(xiàng)目客戶端媒抠,UI原型圖設(shè)計(jì)工具
https://www.mockplus.cn/
https://www.mockplus.cn/rp?hmsr=bdtg68&bd_vid=6069279932084393361
image.png
ECMAScript8
http://www.ecma-international.org/ecma-262/8.0/
thinkphp 寫的后臺框架 fastadmin
https://doc.fastadmin.net/doc/install.html
ArtDialog
一個(gè)設(shè)計(jì)優(yōu)美,對瀏覽器兼容性極強(qiáng)的對話框插件弟断。使彈出窗口處理,事件以及數(shù)據(jù)的傳輸?shù)玫搅烁玫慕y(tǒng)一管理方式
http://aui.github.io/artDialog/
Ztree:利用 JQuery 的核心代碼,實(shí)現(xiàn)一套能完成大部分常用功能的 Tree 插件
http://www.treejs.cn/v3/main.php#_zTreeInfo
codemirror一個(gè)代碼編輯js插件,支持各種編程語言的高亮處理
less
Less 是一門 CSS 預(yù)處理語言趴生,它擴(kuò)展了 CSS 語言阀趴,增加了變量、Mixin苍匆、函數(shù)等特性刘急,使 CSS 更易維護(hù)和擴(kuò)展。Less 可以運(yùn)行在 Node 或?yàn)g覽器端浸踩。
http://lesscss.cn/
SWFUpload:flash多文件上傳
https://github.com/wordpress/secure-swfupload
CMP4
一個(gè)非常優(yōu)秀的flash媒體文件播放插件,支持流媒體,常用音樂視頻的播放工具叔汁。支持換皮膚,高可配置性的設(shè)置。列表xml的動態(tài)加載。mms流媒體,rstp開源協(xié)議媒體播放支持
####### 免費(fèi)的svg 圖片庫
https://loading.io/spinner
Vue Router Tab
基于Vue路由器的Tab路由器組件据块。
官方地址:https://bhuh12.github.io/vue-router-tab/
github:https://github.com/bhuh12/vue-router-tab
文檔:https://bhuh12.github.io/vue-router-tab/guide/
演示:https://bhuh12.github.io/vue-router-tab/demo/
參考的前端項(xiàng)目(目前不在維護(hù))
SUI Mobile - 輕量的開源UI庫(目前好像沒怎么維護(hù)了)
SUI Mobile (MSUI)是由阿里巴巴國際UED前端出品的移動端UI庫码邻,輕量精美!
SUI Mobile 是阿里巴巴國際UED團(tuán)隊(duì)基于 Framework7 開發(fā)的手機(jī)H5 UI庫瑰钮。它的特點(diǎn)是非常輕量冒滩,并且能很好兼容 iOS 6.0+ 和 Android 4.0+ 的設(shè)備。
官網(wǎng)地址:http://sui.taobao.org/
同時(shí)sui還有移動端版本msui浪谴,msui是阿里巴巴共享業(yè)務(wù)事業(yè)部UED團(tuán)隊(duì)的作品开睡。目的是為了手機(jī)H5頁面提供一個(gè)常用的組件庫,減少重復(fù)工作苟耻。
地址:http://m.sui.taobao.org/
FrozeUI
Frozen UI是一個(gè)開源的簡單易用篇恒,輕量快捷的移動端UI框架⌒渍龋基于手Q樣式規(guī)范胁艰,選取最常用的組件,做成手Q公用離線包減少請求智蝠,升級方式友好腾么,文檔完善,目前全面應(yīng)用在騰訊手Q增值業(yè)務(wù)中杈湾。
官網(wǎng)地址:http://frozenui.github.io/
uiKit
uiKit是一款輕量級解虱、模塊化的前端框架,可快速構(gòu)建強(qiáng)大的web前端界面漆撞。
官網(wǎng)地址:http://www.getuikit.net/
H-ui
H-ui是輕量級前端框架殴泰,簡單免費(fèi),兼容性好浮驳,適用于中國網(wǎng)站悍汛。
官網(wǎng)地址:http://www.h-ui.net/
后臺UI開發(fā)框架 MuseUI
一款基于bootstrap風(fēng)格,兼容于主流瀏覽器(包括IE6)的后端UI開發(fā)組件至会。
官方網(wǎng)站:http://www.muse-ui.org//index