前端

前端常用

• sweetalert2 一个自适应，且自定义性强的弹出框（零依赖）
• tippy.js 最著名的 tooltip/popover library
• text-mask 可以让 input 按照规则输入(如电话,email,日期,信用卡等)，特殊格式 input
• dinero.js 用来创建、计算和格式化货币价值的不可变的框架，支持国际化
• lerna 大项目版本控制工具，项目中可以有多个 package.json 文件
• img-2 一个提高图片加载性能和体验的库，懒加载使用 web worker 模糊预览
• fingerprintjs 是一个快速的浏览器指纹库，通浏览环境的一系列配置生成 id
• ajv 一个 json schema 验证的库
• dayjs 一个轻量级类 moment.js API 时间库
• primjs 让页面支持代码高亮
• ReLaXed 一个将 document html 转成 PDF 的工具
• uppy 一个很好看的也很好用的 前端上传库
• Filepond 一个小巧的文件上传库
• tui-calendar 功能全面的日程安排日历控件，还支持拖拽
• tui.editor markdown 所见即所得编辑器
• tabler 基于 Bootstrap 4 的 Dashboard UI Kit 和美观 高颜值 ui 模板
• pulltorefresh.js 下个下拉刷新插件
• lulu 腾讯阅文基于 jQuery，针对 PC 网站 IE8+（peak 主题）的前端 UI 框架
• chancejs 生成随机数据的库
• spritejs 360 奇舞团出的跨平台绘图对象模型
• tui.image-editor 一个功能齐全的在线图片编辑，基于 canvas
• nanoid 前端轻量 unique string ID 生成库
• rxdb 一款开源的快速、灵活的客户端数据库，支持各种浏览器以及 NodeJS，Electron、React 等等，是 PouthDB 之上的一个封装库
• percollate 命令行工具 能将网页转换成 pdf
• rawact 一个 babel 插件，把 react 组件转为原生 dom
• irondb 是一个浏览器 key-value 储存的封装库，把 Cookies、IndexedDB、LocalStorage、SessionStorage 统一成一个接口。它的最大特色就是数据冗余机制，即使某种底层储存机制失效，它可以从其他机制恢复数据。
• big.js 解决 js 浮点数问题。 主要就是 Big Number 或者小数点温柔
• bignumber.js 同上
• stickybits CSS 的 position: sticky 是一个很有用的设置，但是老的浏览器不支持。这个 JS 库是该功能的垫片库。
• react-jsonschema-form Mozilla service 开源了一个通过 JSON 直接生成表单的 React 组件
• cleave.js 用于在输入时格式化输入内容（信用卡格式、日期等）
• shiny 在手机设备上模拟光的反射效果。 支持 DeviceMotion 事件
• cloudquery Turn any website to serverless API
• A-Programmers-Guide-to-English 专为程序员编写的英语学习指南。
• rrweb 一个可以记录你页面中所有操作的库
• nodeppt markdown 写 ppt
• flexsearch 能让你更加高效和快速的检索文本内容
• public-apis 汇集了市面上一些对外免费开放的 api，做一些自己练手 app 的时候很好用。
• scroll-hint 用于提示用户页面可以左右滑动的一个提示库
• fuse.js 轻量级前端模糊查询库 非常的好用
• FileSaver.js 文件下载插件 很多时候下载会有兼容性问题，它能帮你解决这些问题
• instant.page 一个判断用户行为 预测提前加载页面的库
• screenfull.js 浏览器全屏插件 解决了不少兼容性问题
• VuePress 本网站就是基于它实现的，简单方便的静态网站生成器
• selection 可视化选择页面元素的库
• scroll-out 滚动效果（滚动视差）的框架，框架大小不到 1KB,使用回调的方式将相关动画元素的属性进行实时分配
• gpu.js 通过将 js 转为特定的 language，利用 GPU 来执行，大大提高了执行性能和速度
• pressure 前端实现 3D Touch
• hammer 移动端手势库
• AlloyFinger 腾讯出的手势库
• lowdb LowDB 是一个本地 JSON 数据库，基于 Lodash 开发的
• JSON-server 可以配合 LowDB 使用 快速搭建一个 REST API
• lunr.js 是个用于浏览器的轻量级 JavaScript 全文搜索引擎,对于一些小型的博客、开发者文档或 Wiki 网站来说,完全可以通过它实现站内离线搜索
• he 一个前端 encoder/decoder 库
• grade 一个可以根据你的 图片 调整底色的插件
• pretty-bytes 将字节转换成可以读的字符串，比如 1337 个字节，会显示成 1.34 KB
• runkit 一个基于 node 的在线 playground
• chart.xkcd 手绘风格的图表库
• sketchviz 手绘风格流程图
• pagemap Mini map for web pages 页面导航图
• commonmark.js parser and renderer markdown
• body-scroll-lock 解决滚动穿透问题
• lodash 前端工具函数集合
• dayjs 时间处理库，不过大部分情况下我还是用自己的封装的函数
• lightgallery 图片预览组件
• photoswipe 图片预览组件，支持移动端
• darken 页面黑夜模式切换
• mitt 轻量级 pub/sub
• sanitize-html html 过滤库，防 xss
• DOMPurify 比 sanitize-html 更轻量，建议一般业务用这个

Css && 动画

• css-loaders CSS 实现的各种动画加载效果，代码简洁

• animate.css 最有名的动画效果库

• magic.css css 动画效果库 类似 animate.css

• popmotion 一个函数式声明前端动画库

• NES.css 任天堂主题风格 css 库

• particles.js 前端实现颗粒粒子的动画效果库，比较炫酷，但相对的也比较吃性能

• PaperCSS 手绘风格感觉 css 库

• rough 基于 Canvas 的手绘风格图形库

• wired-elements 基于 rough.js 分装 button input radio 等组件。它的底层是 Web components

• roughViz rough 风格的图表库 手绘风格的图表库

• matter-js web 物理引擎

• micron 通过在元素上绑定属性从而实现动画效果的库

• direction-reveal 根据鼠标进入位置，展现从不同方向 展现 hover 效果

• laxxx 滚动特效库 轻量级 压缩完 2kb

• cssfx 优雅的 CSS 动画效果，开箱即用

• zdog 3D engine 引擎

• leonsans 酷炫的 字体 动画 geometric sans-serif typeface made with code

• css-doodle A web component for drawing patterns with CSS 一个用于使用 CSS 绘制图案的 Web 组件

Vuenew

• Element UI: 一套为开发者、设计师和产品经理准备的基于Vue 2.0的桌面端组件库。

• Element Plus:基于 Vue 3，面向设计师和开发者的组件库

• Quasar Framework: 一个功能强大的Vue框架，提供丰富的组件和功能，可以构建高性能、跨平台的应用。

• Ant Design Vue: Ant Design的Vue实现，提供高质量的UI组件。

• Vuelidate: 简单、轻量级的Vue表单验证库。

• ECharts for Vue: ECharts的Vue封装，用于数据可视化。

• Vue Chart.js: 基于Chart.js的Vue组件，用于绘制图表。

• Pinia: Vue的轻量级状态管理库，是Vuex的替代品，设计更简单直观。

• Tiptap: 一个基于ProseMirror的富文本编辑器，具有高度可定制性，适用于Vue。

• Vue FilePond: Vue的文件上传组件，提供现代的文件上传功能。

• Vue Cropper: 一个图片裁剪组件，功能强大且易于使用。

• vue-multiselect select 组件 目前 vue 里面用过最好用的

• Vue.Draggable DnD 拖拽组件 基于 Sortable.js 的 vue 版本

• vue-sauce 一个可以展示 vue 源码的指令

• vue-smooth-dnd Vue wrappers components for smooth-dnd

• vuegg 一个 vue 可视化拖拽界面生成器

• vee-validate 基于 vue 的验证，能验证的内容比较全

• vuesax 一个很漂亮的基于 vue 的 ui 框架

• vue-analytics 基于 vue 的 谷歌统计封装

• vue-virtual-scroller 基于 vue 的虚拟列表无限滚动

• vue-content-placeholders 页面龙骨 skeleton

• buefy 适配移动端的 vue 组件库 看着还挺舒服的

• vxe-tablevue 表格解决方案，还没具体用过看着的确解决了其它 table 组件的一些问题

• Vue 测试指南 vue 测试指南

实践库

• Jasonette 一个用 json 来构建 hybrid App 的框架
• crate 一个 react 全栈练习(pc,mobile,rn,api) demo，适合入门拿来练手
• react-in-patterns 一本开源教你如何写 react 的书
• hocs react 相关 hoc 收集库

文档 new

• vitepress 由Vite驱动的VuePress的下一个迭代，适用于文档网站，速度真的很快
• vuepress 一个以Vue驱动的静态网站生成器，适合技术文档的编写
• docsify 轻量级文档工具，但其是运行时编译的，所以 seo 不好
• GitBook 一个现代化的文档平台，允许团队创建、编辑和维护文档。它支持Markdown格式，并提供强大的版本控制和协作功能。尽管编译速度可能较慢，但其功能强大且界面友好，使其成为技术文档和知识库的优秀选择，专注于商业产品而不是开源工具。
• mdx jsx + markdown
• docz 基于MDX构建，旨在为React组件创建文档。它可以帮助你快速生成文档，并提供实时编辑和预览功能，非常适合构建和维护React组件库的文档。
• storybook 个用于开发和展示UI组件的工具，支持React、Vue、Angular等多个框架。它允许你在独立环境中开发组件，并为每个组件编写故事（Story），便于测试和展示。Storybook不仅适用于文档，还能作为组件开发和测试工具。

工具库

• live-server 可以快速启一个本地 dev 服务 并且支持自动刷新的 http server
• serve 快速起本地静态服务
• picojs js 人脸识别库
• es-checker 检查当前环境对 ES6 支持的情况。支持浏览器和 node.js
• merge-images 图片合成，利用canvas能将几张图片合成一张
• fabric.js 基于 canvas 创建交互式的图片编辑界面非常适合用来做图片合成类工作。
• phaser 这是一个为桌面和移动浏览器开发 HTML5 游戏的快速开源框架。 你可以为 iOS、 Android 和不同的本地应用程序创建游戏。
• purifycss 移除没使用到的 css
• dropcss 同上
• fast-cli 命令行测试下载上传速度
• @pika/web 让你不需要在本地 webpack 中 import，直接在游览器里面运行 npm 包
• pinyin 汉字拼音转换工具
• JavaScript Obfuscator Tool js 代码混淆工具
• tesseract 图像识别，它能识别图片中的文字，支持中文
• gka 一款高效、高性能的帧动画生成工具。只需一行命令，快速图片优化、生成动画文件，支持效果预览。
• recast 前端 ast 库
• jscodeshift 将 js 内容解析成 AST 语法树，然后提供一些便利的操作接口，方便我们对各个节点进行更改
• stats.js 前端性能监控 如 FPS、内存使用情况等
• PapaParse 解析 csv excel
• mddir 生成 markdown file/folder structure 目录结构 tree
• imagemin 图片压缩库
• inline-css css covert to inline style 在生成 email 格式 html 的时候特别有用
• babel-plugin-try-catch-error-report 全局自动 catch 错误进行数据上报
• StreamSaver.js 大文件下载，不用像 saveAs 那样先读到内存中再下载
• mammoth.js Convert Word documents (.docx files) to HTML
• npkill 列出所有 node_modules，并支持删除
• strapi 开源的解决方案来创建、部署和管理自己的 API，通过图形化界面进行操作