Appearance
关于 package.json 中的一些字段介绍:
- name, type, exports, main字段的含义
name主要用于包的唯一标识type决定包采用那种模块规范,commonjs | esmexports允许引用自己的package name来定义package的入口文件,以及条件导出,根据不同的模块环境,执行不同的文件🚀main包的入口文件,如果package.json中同时存在exports和main字段,则exports优先级更高- vitejs options - resolve.conditions 关于条件导出的介绍
- conditional exports - nodejs.org
- package.json field definitions - nodejs.org
- 🚀🚀 打包JavaScript库的现代化指南 构建一个lib指南
- 确定打包格式:
esm | commonjs | umd | amd - 是否要输出多个文件保留文件格式,还是只输出一个大文件
- 是否使用TypeScript,如何使用则
.d.ts文件需要在package.json#exports或者package.json#types中声明 - 针对浏览器版本,生成多个格式,比如现代浏览器使用
esm版本;老版本浏览器使用umd版本 - 外置框架的处理,不要将框架(比如React,Vue)打到lib中,而是将其添加到
package.json#peerDependencies中 - 🎉配置package.json
name属性version版本控制遵循semver控制策略exports为lib定义公共API,优先使用这个,可定义types(.d.ts文件) &module&import(针对esm作为入口文件) &require(针对cjs) &default- 如果运行的node版本不支持
exports字段,则可能需要在package.json顶层定义types&main&module&browser等字段;如果node支持exports字段,types&main&module&browser这些字段自动被忽略💡 files列举出lib上传到npm registry中包含的文件sideEffects帮助打包工具确认是否包含副作用模块,或者明确指出哪些模块是包含副作用的peerDependencies列举出lib所需的相对依赖
- 定义lib协议,比如
MIT
- 确定打包格式:
- 🎉The complete guide to packaging library - Bjorn Lu@Twitter 比上面文章更加的详细
- 着重介绍了
package.json#exports的各种用户,以及含义 - 发布包构建工具的选择
- 类型文件的处理以及不同模块规范,开发还是生产
- 也可以选择特殊的构建工具 - tsup
- 以及如何使用JSDoc,不使用TS,简化整个过程
- slides github
- slides preview
- 🔧 发布包之前对lib进行在线验证工具
- 着重介绍了