常用工具库整理

收集个人使用过或遇到的类库，按照类别进行分类，方便查找（不定期更新）

工具库

lodash

一个一致性、模块化、高性能的 JavaScript 实用工具库

ramda

专为函数式编程而设计的工具库

qs

带有一些附加安全性的请求参数 parse 和 stringify 库

ahooks

react

一套高质量可靠的 React Hooks 库

vueuse

vue

Vue Composition API 的常用工具集

时间处理

dayjs

轻量的处理时间和日期的 JavaScript 库，和 Moment.js 的 API 设计保持完全一样

moment

JavaScript 日期处理类库

date-fns

轻量级的 JavaScript 日期库，纯函数实现支持模块化

lunar-javascript

支持阳历、阴历、佛历和道历的日历工具库

calendar.js

中国农历（阴阳历）和西元阳历即公历互转

请求处理

axios

基于 promise 的 HTTP 库，可以用在浏览器和 Node.js 中

got

node

一个人性化且功能强大的 Node.js HTTP 请求库

精度处理

big.js

用于任意精度的十进制算术运算

number-precision

超小型精确四则运算

字符串文本处理

camelcase

将使用破折号/点号/下划线/空格分隔的字符串转换为驼峰形式（camelCase）

change-case

快速转换字符串格式，支持 camelCase, PascalCase, Capital Case, snake_case, param-case, CONSTANT_CASE 等

emoji-regex

匹配 emoji 的正则表达式

动画

typed.js

动态打字效果

countup.js

数字滚动动画

react-countup

react

基于 countup.js 封装的 React 组件

tween.js

补间动画引擎

lottie

基于跨平台动画渲染库，用于解析使用 Bodymovin 导出为 json 的 Adobe After Effects 动画

gsap

GreenSock 动画平台（GSAP）可以对 JavaScript 可以操作的所有内容进行动画处理

react-transition-group

react

基于 DOM 的过渡动画

framer-motion

react

一个生产级的 React 动画库

react-spring

react

一个基于弹性力学的现代动画库

auto-animate

一个零配置的插件动画实用程序

特效

canvas-confetti

五彩纸屑特效

本地存储

localForage

一个快速、简单的 JavaScript 存储库

lowdb

一个简单、快速的 JSON 数据库

滚动处理

body-scroll-lock

一种通用的 body 滚动锁定解决方案

better-scroll

重点解决移动端（已支持 PC）各种滚动场景需求的插件

perfect-scrollbar

简单且完美的自定义滚动条插件

smooth-scrollbar

可定制、可扩展和高性能的自定义滚动条解决方案

react-scroll

react

React 滚动组件

react-infinite-scroll-component

react

React 无限滚动组件

react-scroll-parallax

react

使用 React 组件或 hooks 实现视差滚动效果

locomotive-scroll

视差平滑滚动

lenis

平滑滚动

事件处理

hotkeys-js

用于捕获键盘输入和输入的组合键

hammer.js

多点触摸手势库

图片处理

medium-zoom

为图片提供可缩放的功能

react-image-crop

react

React 图片裁剪组件

html2canvas

页面截图（将 DOM 节点绘制为 canvas 再生成图片）

html-to-image

页面截图（将 DOM 节点绘制为 canvas 或 SVG 再生成图片）

satori

页面截图（将 HTML 和 CSS 转换为 SVG）

qrcode

QR 码和 2d 条码生成器（支持浏览器和 Node）

qrcode.react

react

React 的二维码组件

qrcode-terminal

node

在终端中生成二维码

音视频处理

howler.js

适用于现代网络的 Javascript 音频库

video.js

HTML5 网络视频播放器，支持 HTML5 视频和现代流媒体格式，以及 YouTube 和 Vimeo

xgplayer

一款带解析器、能节省流量的 HTML5 视频播放器

文件处理

FileSaver.js

保存/下载文件（受 blob 的大小和内存限制）

StreamSaver.js

保存/下载文件（不受 blob 的大小和内存限制）

sheetjs

用于 Excel 的读取和导出

node-fs-extra

node

Node fs 模块的增强（如 promise 的支持）

rimraf

node

用于删除文件和文件夹，类似 rm -rf

glob

node

文件查找

globby

node

使用更友好的文件查找（支持 promise、否定模式、ignore 文件配置等）

cpy

node

使用更友好的文件复制（支持 glob 模式）

版本号处理

semver

语义化版本解析器

数据校验

validator.js

字符串验证

async-validator

异步表单验证

富文本

braft-editor

React 富文本编辑器

代码编辑器

monaco-editor

微软开源的基于 VSCode 的代码编辑器。支持智能提示、代码高亮、代码格式化等

Markdown

markdown-it

Markdown 解析器

mermaid

在 Markdown 中生成流程图、时序图、甘特图、类图、状态图等

代码高亮

prismjs

轻量级、可扩展的语法高亮库

highlight.js

具有自动语言检测功能的语法高亮库

轮播

swiper

高性能的触摸滑动插件，支持 Javascript Vue 3 React AngularJS Solid Svelte

vue-awesome-swiper

vue

基于 swiper 封装的 Vue 组件，支持 Vue 2 和 Vue 3

表单处理

formik

react

提供组件和 Hooks 来管理表单状态和验证

react-hook-form

react

用于表单状态管理和验证的 React Hook

formily

阿里巴巴统一前端表单解决方案，支持 React, React Native, Vue 2/3

表格

ag-grid

功能齐全的高性能表格，支持 Javascript Vue React AngularJS Web Components

拖放

Sortable.js

适用于现代浏览器和触摸设备的可重新排序的拖放列表

dnd-kit

react

React 的现代、轻量级、高性能、可访问和可扩展的拖放工具包

vue-draggable-plus

vue

支持 Vue2 和 Vue3 的拖拽组件

用户体验

react-joyride

react

用户引导动画（使用 mix-blend-mode 实现高亮）

vue-tour

vue

用户引导动画（使用 box-shadow 实现高亮选中）

shepherd

用户引导动画（基于 SVG 和 floating-ui）

intro.js

用户引导动画（使用 box-shadow 实现遮罩）

driver.js

用户引导动画（使用 outline 实现遮罩）

clipboard.js

复制到剪贴板

copy-to-clipboard

复制到剪贴板

clipboardy

node

在 Node.js 中访问系统剪贴板

screenfull.js

将页面或任何元素全屏显示

nprogress

轻量级的加载进度条

floating-ui

创建浮动元素的轻量库（气泡提示、用户引导、下拉框等）

评论系统

giscus

利用 GitHub Discussions 实现的评论系统

gitalk

一个基于 GitHub Issue 和 Preact 开发的评论系统

waline

一款简洁、安全的评论系统

开发调试

serve

node

在本地快速启动一个静态文件服务器（支持各种配置功能强大）

http-server

node

在本地快速启动一个静态文件服务器（轻量）

eruda

在移动浏览器上展示开发者调试面板

vconsole

一个轻量、可拓展、针对手机网页的前端开发者调试面板

编译&构建&打包

Vite

下一代前端工具链

Rollup

一个 JavaScript 模块打包器

Turbo

基于 Rust 的增量打包和构建系统

Webpack

一个用于现代 JavaScript 应用程序的静态模块打包工具

Babel

Babel 是一个 JavaScript 编译器

esbuild

基于 Go 的前端编译工具

SWC

基于 Rust 的 Web 编译平台

tsup

零配置的 TypeScript 打包工具

unbuild

一个统一的 javascript 构建系统

unplugin

用于构建工具的统一插件系统

Webpack 相关

webpack-chain

使用链式 API 来生成和简化 webpack 的配置的修改

speed-measure-webpack-plugin

统计 webpack 在各阶段的构建速度

webpack-bundle-analyzer

通过可视化分析 webpack 打包文件的大小

解析相关

cheerio

node

为服务器特别定制的，快速、灵活、实施的 jQuery 核心实现，可以解析任何 HTML 或 XML 文档

自动化工具

playwright

支持 Firefox / Chrome / WebKit(Safari) 三大浏览器的自动化工具

puppeteer

控制 Chromium 的自动化工具

puppeteer-extra

puppeteer 的插件扩展

lint / 格式化相关

prettier

代码格式化工具

eslint

ECMAScript/JavaScript 代码检查工具

stylelint

CSS 代码检查工具

markdownlint

Markdown 格式检查工具

commitlint

Git Commit Messages 格式检查工具

相关辅助工具

husky

Git Hooks 工具，让你操作 Git Hooks 变得更容易

lint-staged

只对 Git 暂存文件运行 lint 从而提高速度

commitizen

commit 辅助工具，获得有关提交消息格式的即时反馈

CLI 工具

zx

用 JavaScript 或 TypeScript 编写简单的命令行脚本

tsx

使用 esbuild 增强 Node.js 以运行 TypeScript 和 ESM

inquirer

交互式命令行工具

enquirer

交互式命令行工具（更好看）

prompts

轻量级交互式命令行工具

execa

Node child_process 模块的增强（如 promise 的支持、移除输出中最后的换行符等）

npm-run-all

用于并行或串行执行多个 npm 脚本

commander.js

编写指令和处理命令行

yargs

命令行参数解析

plop

轻量级的项目搭建生成工具

dotenv

从 .env 文件加载环境变量到 process.env

dotenv-expand

dotenv 的变量扩展，使 .env 文件支持变量语法

simple-git

在 node 中执行 git 命令

cosmiconfig

搜索并加载配置文件

chokidar

轻量且高效的跨平台文件监听库

命令行输出美化

chalk

美化终端输出的文本样式

picocolors

美化终端输出的文本样式（更轻量）

ora

命令行 loading 效果

站点生成器

Astro

一个现代化的轻量级静态站点生成器

VitePress

由 Vite 和 Vue 驱动的静态网站生成器

VuePress

Vue 驱动的静态网站生成器

dumi

基于 Umi 为组件研发而生的静态站点框架

Docusaurus

基于 React 的静态网站生成器