PUBLISHING A TYPESCRIPT PACKAGE TO NPM IN 2023 在 2023 年将 TYPESCRIPT 包发布到 NPM

December 13th, 2023 12月13th，2023

Recently I wrote a small Typescript package, youtube-subtitle-transcript, that fetches the transcripts of YouTube videos. I wanted to publish it to npm so that I could import it into some of my other projects and share it with others. However, it had been a while since I had published anything to npm so I had forgotten how it all works. Now that it’s published, I’ve consolidated all of my notes below.
最近我写了一个小的打字稿包，youtube-subtitle-transcript，它获取YouTube视频的成绩单。我想将它发布到 npm，以便我可以将其导入到我的其他一些项目中并与他人共享。但是，我已经有一段时间没有向 npm 发布任何内容了，所以我忘记了它是如何工作的。现在它已经出版了，我在下面整合了我所有的笔记。

PACKAGING FOR ESM AND CJS WITH TSUP 使用 TSUP 的 ESM 和 CJS 封装

ECMAScript modules (ESM) may be the future but CommonJS (CJS) is still around and I wanted to package my library for both. The tool that I landed on for this is tsup. Install it as a dev dependency (npm i tsup -D) . Assuming that the entry file for the library is index.ts, in your package.json file, specify the main entry points of the package:
ECMAScript 模块（ESM）可能是未来，但 CommonJS （CJS）仍然存在，我想为两者打包我的库。我为此登陆的工具是 tsup。将其安装为 dev 依赖项（ npm i tsup -D ）。假设库的入口文件是 index.ts ，在您的 package.json 文件中，指定包的主要入口点：

"main": "./dist/index.js",
"module": "./dist/index.mjs",
"types": "./dist/index.d.ts",
"exports": {
  ".": {
    "require": "./dist/index.js",
    "import": "./dist/index.mjs",
    "types": "./dist/index.d.ts"
  }
},
"scripts": {
  "build": "tsup index.ts --format cjs,esm --dts --clean"
}

Running this build script will generate a dist folder with the transpiled code for both ESM and CJS.
运行此构建脚本将生成一个 dist 文件夹，其中包含 ESM 和 CJS 的转译代码。

TESTING THE PACKAGE 测试软件包

Before publishing, we can validate the package using publint.dev . This will give you an idea of how compatible it is across environments. Run it locally with npx publint.
在发布之前，我们可以使用 publint.dev 验证包。这将使您了解它在不同环境中的兼容性。在本地使用 npx publint .

Another trick I learned is that you can use the package’s path in the package.json of another project to test it works locally. In the other project, this would look like:
我学到的另一个技巧是，你可以在另一个项目中使用包的路径 package.json 来测试它在本地的工作。在另一个项目中，这将如下所示：

dependencies: {
  "new-package": "file:/Users/michael/new-package"
}

And then do an npm install. This links the dist directory of the package locally to your project. If you rebuild the package, this will be immediately reflected in the project
然后做一个 npm install .这会将包的 dist 目录本地链接到您的项目。如果重新生成包，这将立即反映在项目中

PUBLISHING TO NPM 发布到 NPM

After validating the package, it’s time to push it to npm. This includes:
验证包后，是时候将其推送到 npm 了。这包括：

Running the build script to generate distribution files (e.g., dist folder) from your source code.
运行生成脚本以从源代码生成分发文件（例如文件夹 dist ）。
Ensuring that the GitHub repository only contains the source code, documentation, configuration files, and other necessary files.
确保 GitHub 存储库仅包含源代码、文档、配置文件和其他必要文件。
Exclude the build artifacts (e.g., dist folder) from version control using a .gitignore file.
使用 .gitignore 文件从版本控制中排除生成工件（例如文件夹 dist ）。

SPECIFYING WHAT TO PUBLISH 指定要发布的内容

In the package.json, we can use the files field to specify which files should be included in the published package. Generally, you do not need to include source files in the published package.
在 package.json 中，我们可以使用该 files 字段来指定哪些文件应包含在已发布的包中。通常，不需要在已发布的包中包含源文件。

The files field in package.json will look something like this:
package.json 中的 files 字段将如下所示：

"files": ["dist", "README.md", "LICENSE"],

USING NP FOR PUBLISHING 使用 NP 进行发布

To publish we need to:
要发布，我们需要：

Run tests (if there are any)
运行测试（如果有）
Update version in package.json according to Semver
package.json 根据 Semver 进行更新 version
Create a git tag according to Semver
根据 Semver 创建 git 标签
Push the package to Github
将包推送到 Github
Push the package to npm
将包推送到 npm
Create release notes for every update
为每次更新创建发行说明

I used to do this all manually and found it to be headache inducing pain. Now I have found np, which markets itself as a better npm publish and really lives up to its name. I installed it globally with sudo npm install -g np and then publish by running np in the project folder and following the prompts - it’s great.
我曾经手动完成这一切，发现这是头痛引起的疼痛。现在我找到了 np，它把自己推销为一个更好的 npm 发布，并且真的名副其实。我全局 sudo npm install -g np 安装了它，然后通过在项目文件夹中运行 np 并按照提示进行发布 - 这很棒。

原文地址 mikeesto.com/posts/publi…

在 2023 年将 TYPESCRIPT 包发布到 NPM[译文]