前端常用工具庫整理(全)

以下爲對npm常用庫的整理

庫名 簡介 官網
>>> 功能庫 <<<
Axios 一個基於 promise 的 HTTP 庫,可以用在瀏覽器和 node.js 中 http://www.axios-js.com/
Lodash 一個一致性、模塊化、高性能的 JavaScript 實用工具庫 https://www.lodashjs.com/
Underscore 一個JavaScript實用庫,提供了一整套函數式編程的實用功能,但是沒有擴展任何JavaScript內置對象。 https://underscorejs.net/
Ramda 一款實用的 JavaScript 函數式編程庫。 https://ramda.cn/
Moment.js 時間處理庫 http://momentjs.cn/
MathJS 這個庫是 JavaScript 和 Node.js 的數學擴展庫,與 JavaScript 內置的 Math 庫兼容。 https://mathjs.org/
Day.js 僅 2 kb大小的時間處理庫,和 Moment.js 的 API 設計保持完全一樣 https://dayjs.fenxianglu.cn/
tui.calendar ThorUI,輕量、簡潔、全面的移動端組件庫中的日曆組件 http://www.thorui.cn/doc/docs/thorui/tui-calendar.html
Keycode 獲取鍵盤按鍵的 JavaScript keycode http://keycode.info/
>>> 前端UI庫 <<<
Bootstrap Bootstrap 是最受歡迎的 HTML、CSS 和 JS 框架,用於開發響應式佈局、移動設備優先的 Web 項目。 https://www.bootcss.com/
ElementUI 可以很好的搭配vue來進行項目的開發,提供了很多風格統一美觀的組件。 https://element.eleme.cn
Antd Design antd 是基於 Ant Design 設計體系的 React UI 組件庫,主要用於研發企業級中後臺產品。 https://ant.design/index-cn
Thor-UI ThorUI,輕量、簡潔、全面的移動端組件庫 http://www.thorui.cn
>>> 佈局 <<<
Macy.js 僅 4 kb的 原生 流佈局插件 http://macyjs.com/
Section separators CSS 實現區域分割 https://tympanus.net/Development/SectionSeparators/
>>> JS滾動動畫 <<<
wow.js 讓頁面滾動更有趣 dowebok.com/demo/131/
Barba.js 流式頁面過渡 https://barba.js.org/
Waypoints.js 滾動到某個元素位置時觸發一個功能 http://imakewebthings.com/waypoints/
fullPage.js 基於 jQuery 的插件,它能夠很方便、很輕鬆的製作出全屏網站 http://fullpage.81hu.com/
Scrolline.js 頁面滾動時顯示滾動進度 https://jquery-plugins.net/scrolline-js-scroll-line-bar-indicator-on-page
Animate on scroll 漂亮的頁面滾動元素動畫 https://michalsnik.github.io/aos/
Pagepiling.js 全屏滾動 https://github.com/alvarotrigo/pagePiling.js
>>> JS特效動畫 <<<
tippyjs 玩轉鼠標懸停提示信息 https://atomiks.github.io/tippyjs/
Vivus.js 在 SVG 上繪製動畫 http://maxwellito.github.io/vivus/
Highlight.js web 語法高亮 https://highlightjs.org/
OWL Carousel.js 走馬燈插件 https://www.dowebok.com/demo/2014/93/
typed-js 打字效果 https://mattboldt.com/demos/typed-js/
Velocity.js 動畫庫 http://velocityjs.org/
Tween.js TweenJS類庫主要用來調整和動畫HTML5和Javascript屬性,提供了簡單並且強大的tweening接口。 http://www.createjs.cc/tweenjs/
Shepherd.js 爲應用創建新手引導 https://github.com/HubSpot/shepherd
Anime.js 動畫庫 https://www.animejs.cn/
Dragdealer.js 炫酷拖 https://skidding.github.io/dragdealer/
Sortable 拖拽插件 http://www.sortablejs.com/
>>> CSS動畫 <<<
Motio 一個基於動畫和平移的雪碧圖庫 https://darsa.in/motio/#!introduction
Animate.css 常用的CSS動畫 https://animate.style/
Bounce.js 創建炫酷的 CSS3 動畫 http://bouncejs.com/
TweenMax 動畫庫 https://www.tweenmax.com.cn/
Barba.js 流式頁面過渡 https://barba.js.org/
CSSpin css spinners 合集,CSS Spinners and Loaders https://webkul.github.io/csspin/
Magic animations CSS3 實現動畫特效 https://www.minimamente.com/project/magic/
>>> 顏色、配色 <<<
Flat UI Colors 扁平化設計配色 https://flatuicolors.com/
Colorrrs 隨機顏色生成器 https://www.webfx.com/web-design/random-color-picker/
>>> ICON <<<
Ion icons Icon 集合 https://ionicons.com/
Font awesome Icon 集合 https://feathericons.com/
阿里圖標庫 - https://www.iconfont.cn/
On/Off switch 使用 CSS 創建 on/off 開關、radio 按鈕 https://proto.io/freebies/onoff/
>>> 字體 <<<
Font awesome 字體集合 https://fontawesome.com/
Font generator 組合多個字體創建混合字體 https://brandmark.io/font-generator/
>>> 可視化 <<<
D3JS 繪圖庫 https://d3js.org/
ChartJS 提供了 8 種不同類型的數據可視化,每種類型都支持動畫和定製。 https://www.chartjs.org/samples/latest/
Echarts 數據可視化 https://echarts.apache.org
HighCharts 方便快捷的純 JavaScript 交互性圖表,是目前是市面上最簡單靈活的圖表庫。 https://www.highcharts.com.cn/
>>> 3D <<<
Particles.js 一個用來在 web 中創建炫酷的浮動粒子的庫 http://vincentgarreau.com/particles.js/
Three.js 一個用來在 web 中創建 3d 物體和 3d 空間的庫 https://threejs.org/
Tween.js TweenJS類庫主要用來調整和動畫HTML5和Javascript屬性,提供了簡單並且強大的tweening接口。 http://www.createjs.cc/tweenjs/
>>> 識別 <<<
tesseract.js OCR識別js語言庫 https://tesseract.projectnaptha.com/
trackingjs 人臉識別庫 官網,示例
>>> 其它 <<<
Awesome Vuejs Resource Vue 資源 https://github.com/suifeng123/awesome-vue-cn
Touch.js 移動端手勢庫 https://www.w3cways.com/2007.html
httpserver 輕量級本地web服務器
TwentyTwenty 一個對比圖片的可視化 diff 工具 https://zurb.com/playground/twentytwenty
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章