构建工具
Name/GitHub/NPM
描述
演示地址
Vite
下一代的前端工具链
Create React App
通过运行一个命令来设置现代 Web 应用程序。
Create React App中文文档
通过运行一个命令来设置现代 Web 应用程序。
Webpackjs
强大的静态模块打包工具,主要用于现代JavaScript应用的构建和打包
Rollup
将点滴代码编织成错综复杂的程序。
vite-plugin-mock-dev-server
在vite 开发环境中注入 mock-dev-server, 模拟请求和数据响应
小程序/Uniapp
Name/GitHub/NPM
描述
演示地址
微信小程序官方文档入口
小程序,小游戏,等文档
taro
Donut
Donut 平台覆盖开发、部署、产品体验分析全产品开发周期的各种需求。开发者可以专注于代码逻辑,其他的都交给我们。
uni-helper
旨在增强 uni-app 系列产品的开发体验
基础Vue
Name/GitHub/NPM
描述
演示地址
Vue-Router
Vue Router 是 Vue 官方的客户端路由解决方案。
Vue-Cli
?? Vue.js 开发的标准工具
Vue2
渐进式 JavaScript 框架
Vue3
渐进式 JavaScript 框架
Vuex
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。
Pinia
符合直觉的 Vue.js 状态管理库
Umijs
用 Umi 构建你的下一个Vue应用
Nuxt
NuxtJS 让你构建你的下一个 Vue.js 应用程序变得更有信心。这是一个 开源 的框架,让 web 开发变得简单而强大。
基础React
Name/GitHub
描述
演示地址
preactjs
React 的轻量级替代方案,体积仅有 3kB,并且拥有与 React 相同的 API
React 文档
The library for web and native user interfaces
craco
Create React App 配置覆盖,这是一个用于 Create React App 的简单易懂的配置层。
react-redux
Redux 的官方 React 绑定
redux-toolkit
The official, opinionated, batteries-included toolset for efficient Redux development
redux中文文档
React-router
Nextjs
The React Framework for the Web
Umijs
用 Umi 构建你的下一个 React 应用
飞冰 (ICE)
基于 React 的应用研发框架,开箱即用,同时支持移动端和桌面端
NPM库
VUE专用库
Name/GitHub
描述
演示地址
vueuse
Vue 组合实用程序集合
vuefire
VueFire Official Firebase bindings for Vue.js Idiomatic composables for realtime data and other Firebase services
vue-grid-layout
Vant
UI组件库-Mobile
Antd-vue
UI组件库-PC
Datav-vue
Vue 大屏数据展示组件库
Tdesign-Vue
UI组件库-PC
varlet
UI组件库-PC
vue-awesome-swiper
?? Swiper component for @vuejs
vee-validate
vue-transitions
Reusable interface transitions for Vue 2
and Vue 3
with no CSS needed
vue-office
支持多种文件(docx、excel、pdf)预览的vue组件库,支持vue2/3。也支持非Vue框架的预览。文档https://501351981.github.io/vue-office/examples/docs/
vue-plugin-hiprint
vue-plugin-hiprint(基于hiprint 2.5.4) 当时只是为了方便我(并非hiprint原作者) 在vue项目中引入使用,所以以此命名。打印模板
vue-macros
Vue Macros 体验超现代 Vue 探索更多的宏和语法糖到 Vue 中。
pinia-plugin-persistedstate
pinia持久化
React专用库
Name/GitHub
描述
演示地址
AHooks
一套高质量可靠的 React Hooks 库
zustand
一个小型、快速、可扩展的熊骨状态管理解决方案,采用简化的通量原理。它有一个基于钩子的舒适应用程序接口,没有模板化,也没有主观臆断。
dvajs
React and redux based, lightweight and elm-style framework.
Datav-React
React 大屏数据展示组件库
Tdesign-React
UI组件库
Antd-Mobile
UI组件库-Mobile
uiw
UI组件库-A Component Library for React 16+.
mui
UI组件库-Move faster with intuitive React UI tools
fusion
企业级的中后台设计系统解决方案
MobX
简单、可扩展的状态管理
emoji-picker-react
Emoji 选择器 React
Immer
Immer(德语为:always)是一个小型包,可让您以更方便的方式使用不可变状态。
通用库
Name/GitHub
描述
演示地址
Echarts
图表
Bootcss
样式
Swiper
工具-轮播图
JQuery
jQuery 是一个快速、小巧且功能丰富的 JavaScript 库。
lodash
Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。
lottiefiles
为您的网站和应用程序提供轻量级、可扩展的动画
Mock
生成随机数据,拦截 Ajax 请求
Numeral-js
用于格式化和处理数字的 javascript 库。
clipboardjs
将文本复制到剪贴板的现代方法 没有 Flash。没有框架。压缩后只有 3kb
browserslist
共享浏览器兼容性配置,适用于 Autoprefixer、Babel、ESLint、PostCSS 和 Webpack 等流行 JavaScript 工具
Socket.IO
支持及时、双向与基于事件的交流。它可以在每个平台、每个浏览器和每个设备上工作,可靠性和速度同样稳定。
msw
Mock Service Worker是一个 API 模拟库,允许您编写与客户端无关的模拟并在任何框架、工具和环境中重复使用它们。
jestjs
Jest 是一款优雅、简洁的 JavaScript 测试框架。
animejs
是一个轻量级 JavaScript 动画库,具有简单但功能强大的 API。 它可与 CSS 属性、SVG、DOM 属性和 JavaScript 对象配合使用。
smooth-scrol
一个轻量级脚本,用于为滚动到锚点链接制作动画。
https://codepen.io/cferdinandi/pen/wQzrdM
isotope-layout
过滤和排序神奇的布局(排序的时候有一个动画效果)
nodemailer
Nodemailer是 Node.js 应用程序的一个模块,可让您轻松发送电子邮件。
cheerio
用于解析和操作 HTML 和 XML 的快速、灵活且优雅的库。
relationship
中国亲戚关系计算器 - 家庭称谓/亲戚称呼/称呼计算/辈分计算/亲戚关系算法/親戚稱呼計算機_Chinese kinship system
mande
Simple, light and extensible wrapper around fetch with smart defaults
vestjs
Vest 是一个功能强大且易于使用的 JavaScript 验证框架,可让您编写和运行代码验证
pinyin
pīnyīn, 汉字拼音转换工具。
aplayer
?? Wow, such a beautiful HTML5 music player
fastclick
FastClick 是一个简单易用的库,用于消除click
移动浏览器上物理点击和触发事件之间的 300 毫秒延迟
autofit.js
迄今为止最易用的自适应工具(描述是这样的)
howler
howler.js是一个适用于现代网络的音频库。它默认使用Web Audio API,并可回退到HTML5 Audio。这使得使用 JavaScript 处理音频在所有平台上都变得简单而可靠。
opentype.js
使用 JavaScript 读取和写入 OpenType 字体。
print-js
一个小型的 JavaScript 库,帮助从网络打印。
Fuse.js
强大、轻量级的模糊搜索库,没有任何依赖关系。
Typr.js
Typr.js - process fonts in Javascript
https://photopea.github.io/Typr.js/
midnight.js
Midnight.js 可让你即时切换固定标题
https://aerolab.github.io/midnight.js/
Zepto
Zepto是一个适用于现代浏览器的极简 JavaScript 库,具有与jQuery高度 兼容的 API 。 如果您使用 jQuery,那么您已经知道如何使用 Zepto。
Nodemon
Nodemon 是一个大约有 300 万个项目依赖的实用程序,它将监视源代码中的任何更改并自动重启服务器。非常适合开发。
alova
一行代码完成各种复杂场景的网络请求,别再花时间在请求这件小事上了,交给我们
magika
使用深度学习检测文件内容类型
JQuery插件库
帝国CMS源码
收费,做来参考吧
zindex
z-index 管理器
terser
适用于 ES6+ 的 JavaScript 压缩器/压缩工具包。
tippy.js
适用于 Web 的完整工具提示、弹出窗口、下拉菜单和菜单解决方案
Yup
Yup 是一个用于运行时值解析和验证的模式构建器。定义架构、转换值以匹配、断言现有值的形状,或两者兼而有之。是的,模式非常具有表现力,并且允许对复杂的、相互依赖的验证或值转换进行建模。
jsdom
jsdom 是许多 Web 标准(尤其是 WHATWG DOM和HTML标准)的纯 JavaScript 实现,用于 Node.js。总体而言,该项目的目标是模拟足够多的 Web 浏览器子集,以便用于测试和抓取真实的 Web 应用程序。
npm-check-updates
npm-check-updates (ncu)将您的 package.json 依赖项升级到最新版本,忽略指定的版本。
highlightjs
高亮
prismjs
高亮
prettier配置生成
生成配置
es-toolkit
一个现代 JavaScript 实用程序库,速度提高 2-3 倍,体积缩小 97% — — 这是 lodash 的重大升级。
xe-utils
javascript 函数库、工具类 文档地址https://vxetable.cn/xe-utils/#/
StreamSaver.js
StreamSaver.js 采用了不同的方法。现在,您实际上可以直接在文件系统中创建可写流(我不是在谈论 Chrome 沙盒文件系统或任何其他 Web 存储),而不是将数据保存在客户端存储或内存中。这是通过模拟服务器如何使用某些响应标头 + 服务工作线程指示浏览器保存文件来实现的
组件开发
地址
描述
dumi
dumi,中文发音嘟米,是一款为组件开发场景而生的静态站点框架,与 father 一起为开发者提供一站式的组件开发体验,father 负责组件源码构建,而 dumi 负责组件开发及组件文档生成。
father
father 是一款 NPM 包研发工具,能够帮助开发者更高效、高质量地研发 NPM 包、生成构建产物、再完成发布。它主要具备以下特性:
histoire
vitepress
由 Vite 和 Vue 驱动的静态站点生成器
Verdaccio
Verdaccio 是一个 Node.js创建的轻量的私有npm proxy registry
rollup-plugin-visualizer
一个强大且直观的工具,用于帮助开发者在使用 Rollup 打包时,生成详细的模块依赖图谱。通过可视化的方式,你可以清晰地理解代码的打包结构和优化潜在点,从而更高效地管理和优化你的 JavaScript 应用程序。
CSS样式
Name/GitHub
描述
演示地址
tailwindcss
一个实用优先的 CSS 框架,其中包含诸如、和之类的类,这些类可直接在您的标记中组合以构建任何设计。 flex pt-4 text-center rotate-90
daisyui
The most popular component library for Tailwind CSS
enjoycss
EnjoyCSS 是一个先进的 CSS3 生成器,可以让您摆脱常规编码。
neumorphism
盒子阴影样式
meshgradient
渐变
noiseandgradien
渐变
meshgradient
渐变毛玻璃
navnav
一些基础的样式
oulu
一个集合180种免费的线性渐变网站,可在任何网站使用(ps:网站还禁止调试…)
webgradients
线性渐变(比上面的更好)
coolors
调色板生成器!(也就是颜色)
dribbble
从世界各地数百万顶级设计师和机构的作品中获得灵感。
dribbble下的css_loader
uiverse
使用 CSS 或 Tailwind 制作的自定义元素。UI Verse
是一个开发资源整合类的网站,内部提供了 4500+
种不同的 css 特效
加载动画css
加载动画
sliderrevolution
不仅仅是一个 WordPress 滑块
cssloaders
很多加载效果css动画
css-loaders
几个加载效果css动画
loading
Ajax 加载器、动画图标、实时背景
css-box-shadow
Beautiful CSS box-shadow examples
uiverse.io
Open-Source loaders made with CSS or Tailwind(使用 CSS 或 Tailwind 制作的开源加载器)
字体和素材库
Name/GitHub
描述
演示地址
iconpark
字体图标-丰富多彩的资源库免费使用
iconfont
字体图标
illust
下載免費矢量圖和剪貼畫
transfonter
现代而简单的 css @font-face 生成器
fontawesome
Font Awesome 是互联网的图标库和工具包,被数百万设计师、开发人员和内容创建者使用。
iconshock-渐变svg图
专为渐变爱好者制作的 免费交互式 SVG 图标包 !
lexica
AI生成的图片大全
unsplash
也是一个图片网站
稿定
国产的…可能要收费
创客贴
国产的…可能要收费
Canva可画
使用Canva可画,轻松创建并分享专业设计。(可能要收费)
爱给网
爱给网_音效配乐_3D模型_视频素材_免费下载
文档和工具
地址
描述
MDN
文档
CanIuse
用于前端开发者查询各种Web技术在不同浏览器中的兼容性。其主要功能和用途包括:
npmTrends
用于比较NPM(Node Package Manager)包下载趋势和受欢迎度的工具
贝赛尔曲线 cubic-bezier
js代码压缩混淆
jsnice
旨在美化和反混淆JavaScript代码。其主要功能和用途包括:
babel
用于将现代JavaScript代码转换为兼容性更好的旧版JavaScript代码。
less
给 CSS 加点料。
jquery之家
自由分享jQuery、html5和css3的插件库
less编译
less编译
stackoverflow
问答交流
思否
问答交流
文档速查
十分推荐
油猴文档
油猴必备
JSDOC
JSDoc 3 是一个用于 JavaScript 的API文档生成器,类似于 Javadoc 或 phpDocumentor
W3C
前端最最最标准文档
ES6入门-阮一峰
ES6入门-阮一峰
javascript-guidebook
??JavaScript 知识图谱:ECMAScript、DOM、BOM、HTML5、计算机网络
React中文文档
React中文文档
w3schools
也是比较好的文档
bundlephobia
包大小查看
在线部署/在线运行/第三方服务提供
地址
描述
netlify
vercel
codepen
codesandbox
stackblitz
4everland
upstash
planetscale
The ultimate MySQL database platform
algolia
cyclic
render
jsfiddle
jsbin
强大的在线编辑
国内-runjs
在线运行
runjs
探索和试验 JavaScript 和 TypeScript,将您的想法形象化并在打字时获得即时反馈。
跨平台的桌面应用程序
地址
描述
tauri
electron-vite