Appearance
关于 package.json
中的一些字段介绍:
- name, type, exports, main字段的含义
name
主要用于包的唯一标识type
决定包采用那种模块规范,commonjs | esm
exports
允许引用自己的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进行在线验证工具
- 着重介绍了