如何创建和发布您的第一个私有 NPM 包经过@yuraabharian
617 讀數

如何创建和发布您的第一个私有 NPM 包

2022/07/09
1 分钟
经过 @yuraabharian 617 讀數
tldt arrow
ZH
Read on Terminal Reader

太長; 讀書

在本文中,我想展示我们如何轻松创建我们的第一个私有 npm 包。使用私有 npm 包,您可以托管仅对您和有权访问的人可见的代码。 我们会更多地谈论它。我们将在 GitHub 上创建和发布一个私有包,因此请确保您在开始本文之前熟悉先决条件。 我们将讨论如何使用 GitHub Actions 来管理和使用私有代码以及公共代码。

Company Mentioned

Mention Thumbnail
featured image - 如何创建和发布您的第一个私有 NPM 包
Yura Abharian HackerNoon profile picture

@yuraabharian

Yura Abharian

學到更多
LEARN MORE ABOUT @YURAABHARIAN'S EXPERTISE AND PLACE ON THE INTERNET.
react to story with heart

在本文中,我想展示我们如何轻松创建我们的第一个私有 npm 包

我们将在GitHub 上创建和发布一个私有包,因此在开始本文之前,请确保您已熟悉先决条件。所以让我们开始吧。

先决条件:

什么是私有 npm 包以及它可以在哪里使用?

  • 使用私有 npm 包,您可以托管仅对您和有权访问的人可见的代码,从而允许您在项目中管理和使用私有代码以及公共代码。

项目结构

math-lib/ --.github/ --workflows/ --main.yml --build/ this is autogenerated folder --src/ --app.ts --types/ --index.d.ts --.gitignore --package.json --tsconfig.json

第 1 部分:构建私有 npm 包

第 1 步:使用 TypeScript 初始化一个 Node.js 项目。

注意:您可以通过阅读这篇文章How to Setup a Node Express with TypeScript来学习如何做到这一点,或者您可以克隆这个 repo https://github.com/YuraAbharian/node-express-typescript

第 2 步:现在让我们创建 GitHub Actions 工作流程。

让我们添加一些配置:

 name: Node.js Private Package on: push: branches: - master jobs: publish-gpr: runs-on: ubuntu-latest steps: - uses: actions/[email protected] - uses: actions/[email protected] with: node-version: '14.x' registry-url: 'https://npm.pkg.github.com/' - run: npm install - run: npm run build - run: npm publish env: NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}

注意记住GITHUB_TOKEN,我们稍后会详细讨论

第 3 步:让我们创建/更新src/app.ts文件

export function sum(a: number, b: number): number { return a + b; } export function minus(a: number, b: number): number { return a - b; } export function divide(a: number, b: number): number { return a / b; } export function multiple(a: number, b: number): number { return a * b; }

第 4 步:现在我们需要为我们的包声明一个模块

  • 在项目的根目录下创建一个types目录

  • types目录中创建一个index.d.ts文件

为这个模块添加声明类型

declare module "@GITHUB_USERNAME/PACKAGE_NAME" { function sum(a: number, b: number): number; function minus(a: number, b: number): number; function divide(a: number, b: number): number; function multiple(a: number, b: number): number; }

笔记:

- GITHUB_USERNAME这是你的 github 用户名

- PACKAGE_NAME这是你的私人包名

示例: “@yuraabharian/math-lib”

第 5 步:让我们处理 package.json 文件

{ "name": "@GITHUB_USERNAME/PACKAGE_NAME", "version": "1.0.0", "description": "", "main": "./build/app.js", "author": "", "license": "ISC", "types": "./types/index.d.ts", "publishConfig": { "registry": "https://npm.pkg.github.com/" }, "repository": { "url": "git://github.com/GITHUB_USERNAME/PACKAGE_NAME.git" }, "scripts": { "build": "npx tsc" }, "devDependencies": { "@types/node": "^18.0.0", "typescript": "^4.7.4" } }

示例: git://github.com/yuraabharian/math-lib.git(这将是您 GitHub 存储库的链接)

注意:这些@GITHUB_USERNAME/PACKAGE_NAME 字段与步骤 4中的相同

第 6 步:让我们在推送代码之前配置我们的存储库环境

  • 第 2 步中,我要求您记住GITHUB_TOKEN ,因为这个变量非常重要。

  • 转到GitHub Repository - Settings

GitHub 存储库 - 设置

GitHub 存储库 - 设置

第7步:然后去Secrets

设置 - 秘密

设置 - 秘密

第 8 步:打开Actions

  • 单击New repository secret

添加 GITHUB_TOKEN

添加 GITHUB_TOKEN

必需:通过此链接https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token生成新令牌。

注意:GITHUB_TOKEN保存在别处,因为我们将在本文的第 2 部分中需要它们

注意:授予此令牌的write:packages访问权限

写:包

写:包

第 9 步:现在让我们将代码推送到GitHub

第 10 步:打开存储库 → 操作,您应该会看到您的包已部署

行动

行动

第 11 步:要查找您的包,请转到您的GitHub 个人资料 → 包

包裹

包裹

第一部分的结论:此时您应该看到您的包已部署

在本文的第二部分,我们将学习如何安装私有包,因为它需要一些操作,除了npm install package

第 2 部分:安装和测试

第 1 步:设置 Node.js 项目

注意:您可以在第 1 部分 → 步骤 1中查看如何执行此操作

第 2 步:然后在项目的根目录中插入您的包。你可以通过GitHub profile → Packages → math-lib获取你的包的链接(这是你的包名)

数学库包

数学库包

第 3 步:现在转到 src/app.ts 文件并更新它

import express, {Application, Request, Response} from 'express'; import {sum, minus, multiple, divide} from '@yuraabharian/math-lib'; const app: Application = express(); const PORT: number = 3001; app.use('/sum', (req: Request, res: Response): void => { res.send(`RESULT: ${sum(5, 2)}`, ); }); app.use('/minus', (req: Request, res: Response): void => { res.send(`RESULT: ${minus(2, 2)}`); }); app.use('/multiple', (req: Request, res: Response): void => { res.send(`RESULT: ${multiple(12, 2)}`); }); app.use('/divide', (req: Request, res: Response): void => { res.send(`RESULT: ${divide(10, 2)}`); }); app.listen(PORT, (): void => { console.log('SERVER IS UP ON PORT:', PORT); });

注意:请记住,我正在从我的 @yuraabharian/math-lib 存储库中导入 math-lib 以使您的模板看起来像 @GITHUB_USERNAME/PACKAGE_NAME

第 4 步:运行您的项目npm start

 node-express-typescript % npm start > [email protected] start > npx tsc && node build/app.js SERVER IS UP ON PORT: 3001

第 5 步:转到您的浏览器并打开http://localhost:3001/sum

/sum 端点

/sum 端点

这行得通,所以现在让我们测试所有方法:

/多个端点

/多个端点

/减端点

/减端点

/划分端点

/划分端点

摘要:在本文中,我们创建并测试了您的第一个私有 npm 包,希望您喜欢我的文章。如果您有任何问题,可以通过电子邮件、LinkedIn 或在评论中与我联系。最好的祝愿

相關故事

L O A D I N G
. . . comments & more!
Hackernoon hq - po box 2206, edwards, colorado 81632, usa