fuzzball.js 构建体系揭秘Rollup 如何打包出 15kB/6.3kB/4kB 三个版本的完整流程【免费下载链接】fuzzball.jsEasy to use and powerful fuzzy string matching, port of fuzzywuzzy.项目地址: https://gitcode.com/gh_mirrors/fu/fuzzball.jsfuzzball.js 是一个易用且强大的模糊字符串匹配库fuzzywuzzy 的 JavaScript 移植版。本文完整揭秘它的构建体系一份 Rollup 配置如何打包出 15kB / 6.3kB / 4kB 三个压缩体积的版本从入口文件、插件链到 package.json 的 exports 路由带你走一遍完整流程。先看结果三个版本、两套格式、六个产物fuzzball.js 提供 full / lite / ultra_lite 三个功能档位每个档位都同时产出UMD浏览器 script 直接用和ESM模块化项目 tree-shake 友好两种格式。实测 gzip 后体积如下版本UMDgzipESMgzip相对 full 的体积fullfuzzball.js~15.1kB~15.2kB100%litelite/fuzzball_lite.js~6.3kB~6.4kB约 42%ultra_liteultra_lite/fuzzball_ultra_lite.js~4.0kB~4.1kB约 26%产物分别落在dist/、lite/、ultra_lite/目录下如dist/fuzzball.umd.min.js、lite/esm/fuzzball_lite.esm.min.js。核心配置一份 rollup.config.js六个构建目标整个打包逻辑集中在根目录的rollup.config.js中它导出一个包含 6 个配置的数组规律非常整齐——每个版本两个目标UMD 目标直接以主入口文件为输入如./fuzzball.js输出format: umd全局变量名为fuzzball。ESM 目标以专门的包装文件为输入如esmwrapper.js输出format: es且exports: named实现具名导出。所有目标共用同一条插件链rollup/plugin-commonjs把 CommonJS 的require/module.exports转换成 Rollup 可处理的模块形式这是把fuzzball.js这类传统 IIFE module.exports写法打包的前提rollup/plugin-node-resolve解析heap、lodash、setimmediate等 npm 依赖让它们被内联进最终单文件产物零运行时依赖rollup-plugin-terser压缩混淆并设置keep_fnames: true保留函数名——这对调试堆栈和某些依赖函数名的场景很重要。为什么要多一层 esmwrapper 包装文件主入口fuzzball.js是 CommonJS 风格最后通过module.exports fuzzball整体导出Rollup 从这种写法里提取不出具名导出。因此项目额外提供了三个极薄的包装文件esmwrapper.jsfull 版lite/esmwrapper_lite.jsultra_lite/esmwrapper_ultra_lite.js它们只做一件事引入默认模块再逐个export const ratio fuzzball.ratio;重导出。这样 ESM 产物就能让import { ratio, extract } from fuzzball这样的具名导入工作正常。代价是 README 中提到的ESM 产物由包装器提供不能完全依赖 tree-shaking。体积差异的本质三个入口文件砍掉了什么三个档位不是靠 Rollup 配置裁剪而是靠三份不同大小的源码入口实现的full 版fuzzball.js约 1038 行依赖最全require了lib/fbdifflib.jsSequenceMatcher支撑 partial 系列打分、heap、lodash/orderBy、lib/iLeven.js、lib/wildcardLeven.js等功能完整partial_ratio、通配符、排序 collation、星区字符astral处理、批量 extract 的堆优化等一应俱全。lite 版lite/fuzzball_lite.js约 610 行移除了 fbdifflib、heap 与 lodash 排序依赖因此没有 partial 系列函数通配符支持也仅限基础场景token_set 的集合运算不感知通配符换来约一半的体积。ultra_lite 版ultra_lite/fuzzball_ultra_lite.js约 538 行进一步只保留lib/leven.js编辑距离核心和lib/utils_ultra_lite.js轻量工具集无通配符、无 collation、无 astral 处理、extract 针对大数据集的优化也被简化换来 4kB 的极致体积。也就是说功能档位由源码入口决定Rollup 负责忠实地把它们各自压成最小文件两套机制配合才得到 15kB / 6.3kB / 4kB 的梯度。npm scripts构建流程如何编排package.json中的脚本把整个发布级构建串成了一条链build: npm run build:bundles npm run jsdoc2md npm run test:build npm run build:demo分四步走build:bundles执行rollup --config rollup.config.js产出上文的 6 个压缩产物jsdoc2md用 jsdoc-to-markdown 从fuzzball.js和lib/process.js的注释自动生成jsdocs/fuzzball.md等 API 文档——代码里的 JSDoc 注释因此同时服务于打包者和阅读者test:build以testenvbuild运行 mocha 测试测试见test/test.js与test/testdata.js专门验证刚构建出的产物而非源码防止打包坏了但测试没跑build:demo构建demo-app/下的 React 示例站并复制到docs/供在线演示使用。另外还有一个独立的benchmark脚本benchmark.js用于对比各版本/各打分函数的性能表现。版本路由package.json exports 如何分发三个版本构建完成后package.json的exports字段把三个版本路由给不同的用户**主入口.**require走./fuzzball.jsCommonJS 源码import走./dist/esm/fuzzball.esm.min.js——同一份代码Node 和现代打包器各取所需./lite与./ultra_lite同样区分 require/import让用户通过import { ratio } from fuzzball/lite就能拿到轻量版每个esm/子目录还放了一个仅含type: module的package.json确保.js后缀的 ESM 产物被正确识别为模块。总结一个可复用的三档打包范式fuzzball.js 的构建体系可以归纳为三条经验对任何需要多档位发布的 JS 库都有参考价值档位差异放在源码层三份入口文件而不是指望构建配置做复杂裁剪思路更直观、更可控同一入口同时输出 UMD ESM 双格式用薄包装文件解决 CommonJS 入口的具名导出问题测试构建产物而非源码test:build并配合 exports 条件导出让安装者按fuzzball、fuzzball/lite、fuzzball/ultra_lite三档自由选择——15kB 全功能、6.3kB 精简、4kB 极致轻量。理解了这套流程你再看到任何一个库发布多个体积版本的项目时都能迅速定位到它的 rollup 配置与入口拆分方式了。【免费下载链接】fuzzball.jsEasy to use and powerful fuzzy string matching, port of fuzzywuzzy.项目地址: https://gitcode.com/gh_mirrors/fu/fuzzball.js创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考