如何更好地发布 TypeScript npm 包
当发布 TypeScript 编写的 npm 包时,应该遵循一些最佳实践来确保包的可用性和可维护性。以下是推荐的项目结构和发布流程:
推荐的项目结构
my-package/
├── src/ # TypeScript 源代码
│ ├── index.ts # 主入口文件
│ └── ... # 其他源文件
├── dist/ # 编译后的 JavaScript 文件 (由构建工具生成)
├── types/ # 类型声明文件 (通常执行tsc会自动生成)
├── test/ # 测试代码
├── package.json
├── tsconfig.json # TypeScript 配置
└── README.md
关键步骤
分离源码和编译输出
- 保持
src/和dist/分离 - 将
dist/添加到.gitignore
- 保持
配置 TypeScript 编译
在tsconfig.json中设置:{
"compilerOptions": {
"outDir": "./dist",
"rootDir": "./src",
"declaration": true, // 生成 .d.ts 类型声明文件
"declarationDir": "./types",
"module": "commonjs", // 或 "es2015" 根据目标环境
"target": "es5" // 根据需求调整
},
"exclude": ["node_modules", "dist", "test"]
}
配置 package.json
{
"name": "my-package",
"version": "0.0.1-alpha.1",
"main": "dist/index.js", // CommonJS 入口
"module": "dist/index.esm.js", // ES Module 入口 (可选)
"types": "types/index.d.ts", // 类型声明入口
"scripts": {
"build": "tsc",
"prepublishOnly": "npm run build"
},
"files": ["dist", "types"], // 发布时包含的目录
"devDependencies": {
"typescript": "^5.8.3"
}
}
构建和发布流程
- 开发时在
src/中编写代码 - 运行
npm run build编译代码 - 运行
npm publish发布包 (会自动运行 prepublishOnly 脚本)
- 开发时在
进阶建议
支持多种模块格式:
- 使用 Rollup 或 esbuild 生成 CommonJS 和 ES Module 两种格式
- 在 package.json 中设置
"main"(CJS) 和"module"(ESM)
代码质量检查:
- 添加 ESLint 和 Prettier
- 设置单元测试
版本控制:
- 遵循语义化版本控制 (SemVer)
- 使用
npm version命令管理版本
文档:
- 提供清晰的 README
- 使用 TypeDoc 生成 API 文档
通过这样的结构,你的 TypeScript 包将更易于维护,同时为使用者提供更好的开发体验。
发包
npm publish // 发布普通包
npm publish --access public // 发布域级包
npm unpublish --force
如何更好地发布 TypeScript npm 包的更多相关文章
- 如何发布一个包到npm && 如何使用自己发布的npm包 && 如何更新发布到npm的package && 如何更新当前项目的包?
如何发布一个包到npm First 在https://www.npmjs.com注册一个账号. Second 编辑好项目,文件大致如下: 其中,gitignore可以如下: .DS_Store nod ...
- 从0到1发布一个npm包
从0到1发布一个npm包 author: @TiffanysBear 最近在项目业务中有遇到一些问题,一些通用的方法或者封装的模块在PC.WAP甚至是APP中都需要使用,但是对于业务的PC.WAP.A ...
- (转)前端开发-发布一个NPM包之最简单易懂流程
原文地址:https://www.cnblogs.com/sghy/p/6829747.html 1.npm官网创建npm账户 npm网站地址:https://www.npmjs.com/ npm网站 ...
- 如何发布一个npm包(基于vue)
前言:工作的时候总是使用别人的npm包,然而我有时心底会好奇自己如何发布一个npm包呢,什么时候自己的包能够被很多人喜欢并使用呢...今天我终于迈出了第一步. 前提:会使用 npm,有 vue 基础, ...
- 如何发布一个npm包?
npm包在现在前端开发中经常使用且便利,而我也是经常使用,而没研究怎么去发布npm.那如何发布npm包呢? 一.在npm的官网上注册一个账号登录,https://www.npmjs.com/ 注意此步 ...
- 发布一个npm包(webpack loader)
发布一个npm包,webpack loader: reverse-color-loader,实现颜色反转. 初始化项目 mkdir reverse-color-loader cd ./reverse- ...
- 如何发布一个 npm 包
一 背景 在工作时,突然接到经理的一个要求,需要将一个react的高阶组件函数封装成一个npm包.之前从没弄过,当场还是有些懵逼的,但是这毕竟是工作,不能推脱.于是开始了学习.汤坑之旅.最终包发布,线 ...
- webpack创建library及从零开始发布一个npm包
最近公司有个需求,我们部门开发一个平台项目之后,其他兄弟部门开发出的插件我们可以拿来直接用,并且不需要我们再进行打包,只是做静态的文件引入,研究一波后发现,webpack创建library可以实现. ...
- 发布一个npm包
前言 我这里是写了一个vue轮播图插件,因此我使用了vue的脚手架工具创建一个项目,当然你也可以选择自己搭建脚手架. 本例中我会使用vue脚手架创建一个项目,并发布到npm上面去. 通过脚手架创建项目 ...
- 将Angular6自己定义的模块发布成npm包
创建自己的模块组件 1. ng new 一个工程 2. ng g m 创建模块 例如我这里的modules文件下创建header模块 3. ng g c modules/head 创建一个hear组件 ...
随机推荐
- TCP延迟调优之PSH参数与passt延迟问题修复
qemu中使用passt来作为虚拟机的网卡NAT实现,希望能够利用它IP地址与host一致的优点.这本来是没有啥问题的,但是不知道为什么它的TCP入口流量的延迟很严重. 好吧,反正以后总是要改pass ...
- python获取指定文件夹内文件名称
比如下图,文件夹内有若干文件,且文件夹路径:C:\Users\Administrator\Desktop\2147\1024 4行代码,解决问题 import os path = "C:\\ ...
- MySQL 的存储引擎有哪些?它们之间有什么区别?
MySQL 的存储引擎及其区别 MySQL 提供多种存储引擎,不同存储引擎在数据存储方式.索引支持.事务处理等方面各具特点.以下列出常用的存储引擎及其主要区别. 1. 常见存储引擎 (1)InnoDB ...
- js判断iOS还是Android
/** * 运行设备引擎, 即iOS, Android还是H5 * 返回值注意大小写 * @return iOS, Android, H5 */ function engineType() { let ...
- kubernetes dashboard web控制台调研
背景 kubernetes 是目前最流行的容器化系统,管理的方式一般都是最基础的kubectl命令客户端进行管理,但是对与一些没有基础的研发人员并不是很友好,所以我们需要一些web控制台,类似于云厂商 ...
- K8s进阶之Deployment的更新&回滚
更新概述 更新指的是对 Deployment 所管理应用的配置.镜像版本等进行修改并应用到集群中的过程.通过更新 Deployment,你能够实现应用功能的升级.修复漏洞.调整资源分配等操作. 更新触 ...
- C# 14 新增功能一览,你觉得实用吗?
前言 今天咱们一起来看看在 C# 14 中新增的几个功能特性,是否给我们日常编码带了来便利. 前提准备 要体验 C# 14 中的新增功能,你需要安装最新的 Visual Studio 2022 版本或 ...
- 操作系统综合题之“采用FCFS(先进先出)调度算法执行,计算进程平均带权周转时间”
一.问题:有3个进程p1.p2.p3,其进入系统的时间和服务器时间如下表所示,按FCFS调度算法,她们的平均带权周转时间是多少(注:四舍五入精确到小数点后两位) 二.参考答案 答: p1周转时间 = ...
- SpringSecurity配置 2
SpringSecurity配置 2 目前的现状,虽然是有了登录认证的接口,但是登录完成后,当我们访问受保护的接口时,即使将 Token 令牌携带与请求一起发送,依然是无法请求成功.另外,提示信息如下 ...
- 在deepin环境下安装qt开发环境和dtk开发环境
环境 deepinV20.2.2 第一步 进入系统,进入/etc/apt目录 以管理员身份打开(为了编辑源) 第二步 编辑源sources.list 放出第二行源保存并退出 第三步 进入终端,执行su ...