使用npm发布typescript

什么是NPM

NPM(节点管理器)是 JavaScript 编程语言默认管理器。NPM 注册表一个公共存储库,充当存储分发 JavaScript 包的中心枢纽。它允许开发人员轻松安装管理共享可重用的 JavaScript 代码包,也称为模块或包。

什么是 Typescript 以及为什么使用

TypeScript微软开发的一种编程语言。它是 JavaScript 的超集,这意味着任何有效的 JavaScript 代码也是有效的 TypeScript 代码。与普通 JavaScript 相比,它具有以下优势:

这些好处增强了 NPM 包的开发体验,并使包的用户更容易使用它们并将其集成到他们的项目中,从而产生更可靠、可扩展和可维护的 JavaScript 应用程序

本文中,我们将了解如何使用 Typescript 创建自己的 NPM 包以及如何将其发布到 NPM 注册表

初始化一个typescript项目

export function add(a: number, b: number): number {
  return a + b;
}

console.log(add(3, 5)); // 8

使用 npx ts-node src/index 命令运行代码,我们应该控制台看到结果。之后删除console.log代码中的行。

/node_modules 

# 忽略测试相关文件
/coverage.data 
/coverage/ 

# 构建文件
/dist

创建一个README.md包含项目描述以及如何使用它。

构建 Typescript 包

现在我们已经完成了包的代码编写,我们将继续讨论如何构建我们的包,以便最终用户能够在其各种 javascripttypescript 项目中使用它。

现在有各种专用的构建工具可以帮助完成此过程,例如 tsupbabelwebpackrollup 等,但在本文中我们将重点看看 tsup

安装 tsup

通过运行 npm install tsup -D 或者 yarn add tsup —dev 命令将 tsup 添加到我们的项目。

创建我们的tsup.config.ts文件并粘贴下面的代码

import { defineConfig } from "tsup";

export default defineConfig({
  entry: ["src/index.ts"],
  format: ["cjs", "esm"], // 构建 commonJS 和 ESmodules 
  dts: true, // 生成声明文件 (.d.ts )
  splitting: false,
  sourcemap: true,
  clean: true,
});

使用以下内容更新 package.json 中的 scripts

 "scripts": {
    "build": "tsup",
    "test": "echo "Error: no test specified" && exit 1"
  },

我们现在可以通过运行 npm run buildyarn build 构建我们的项目
更新我们 package.json 文件中的 main添加以下内容:

"main": "./dist/index.js",
"module": "./dist/index.mjs",
"types": "./dist/index.d.ts",
"files": [
    "dist"
 ],

现在我们的包应该已准备发布,但在此之前我们必须测试包以确保代码没问题

测试 NPM 包

测试使我们能够在任何问题或错误到达我们的用户之前发现解决它们。要为 npm 包编写测试,我们需要使用 jest

安装 jest

通过运行 npm install -D jest ts-jest @types/jestyarn add -D jest ts-jest @types/jest 命令将 jest 添加到我们的项目中。

jest.config.js 文件添加到我们的项目并添加以下内容

module.exports = {
  preset: "ts-jest",
  testEnvironment: "node",
};

在项目中创建一个 tests 文件夹,并创建一个 add.test.ts 文件并添加以下测试代码:

import { add } from '../src';

test('adds two numbers correctly', () => {
  const result = add(2, 3);
  expect(result).toBe(5);
});

更新 package.json 中的 scripts:

"scripts": {
    "build": "tsup",
    "test": "jest"
 },

使用 npm run test 或 yarn test 命令运行测试脚本结果应该如下图所示

在这里插入图片描述

发布我们的 NPM 包

最后,在将包发布到 NPM 注册表之前,发布它并在本地计算机测试它非常重要,以确保其正确性、功能性以及与其他模块依赖项的兼容性。本地测试使我们可以尽早发现任何问题或错误,并在向公众发布软件包之前进行必要的改进

本地发布 NPM 包

在这里插入图片描述

将 NPM 包发布到 NPM 注册表

结论

使用 TypeScript 进行包开发和使用会带来许多好处。其静态类型使开发人员能够提高代码质量、早期错误检测和增强的编辑器支持。TypeScript 的类型定义可以提供更好文档并增强对包 API 的理解,促进无缝集成并减少使用者的潜在错误。此外,TypeScript 的生态系统拥有广泛的库、工具资源,促进协作社区支持。

原文地址:https://blog.csdn.net/qq_42880714/article/details/134723885

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任

如若转载,请注明出处:http://www.7code.cn/show_19723.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注