卡卷网
卡卷网
当前位置：卡卷网 / 每日看点 / 正文

如何部署本地的npm仓库？

作者：卡卷网发布时间：2025-01-17 00:32浏览数量：115次评论数量：0次

由于图片和格式解析问题，为了更好阅读体验可前往 [阅读原文]

Gitlab搭建npm仓库 | hengshuai's blog

使用gitlab的仓库注册表特性需要版本14.0+，如果你的版本比较低，请先根据自己的需求合理升级后再使用

npm私有仓库的搭建方式有很多种，比如使用docker(阅读此篇)，这里讲述如何使用gitlab作为npm仓库方法，gitlab仓库有多种使用方法，这里都会讲解到。接下来就来学习下如何使用gitlab搭建npm仓库。

创建组与项目Gitlab搭建npm仓库 | hengshuai's blog创建组与项目

为了方便演示这里从头讲起，分别创建组、项目

  1. 创建组

如何部署本地的npm仓库？ 第1张


  1. 创建项目

如何部署本地的npm仓库？ 第2张

如何部署本地的npm仓库？ 第3张


初始化项目

本地创建一个简单的项目，推送到gitlab项目中

# 创建路径 mkdir gitlab-frontend-helper-lib && ccd gitlab-frontend-helper-lib # 初始化 npm npm init

package.json文件内容实例：

{ "name": "helper", "version": "0.0.1", "description": "前端通用库", "main": "index.js", "keywords": [], "author": "", "license": "ISC" }

创建index.js文件：

const add = (x, y) => x + y; const minus = (x, y) => x - y; module.exports = { add, minus };

推送项目到gitlab

git init cat > .gitignore << EOF node_modules .DS_Store EOF git add . git cm -m '初次提交(#0)' git remote add origin http://192.168.10.10/frontend-lib/helper.git git push --set-upstream origin main

项目作为依赖

你可以在某个项目中把刚刚上传的项目作为依赖安装，为了方便管理可以对上传的库打上tag，然后项目中可以下载指定tag

# gitlab-frontend-helper-lib 打tag git tag 0.0.1 git push --tags

新建一个项目使用当前库：

mkdir gitlab-npm && cd gitlab-npm npm init -y

手动在package.json文件中添加待安装的依赖项目

{ "name": "gitlab-npm", "version": "1.0.0", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC", "dependencies": { // 这里指定 helper依赖的地址为 git+http://192.168.10.10/frontend-lib/helper.git，并使用 tag 0.0.1版本 "helper": "git+http://192.168.10.10/frontend-lib/helper.git#0.0.1" }, "description": "" }

安装当前项目依赖：

➜ npm i npm notice created a lockfile as package-lock.json. You should commit this file. npm WARN use-gitlab-npm@1.0.0 No description npm WARN use-gitlab-npm@1.0.0 No repository field. added 1 package in 0.577s

验证helper包，创建js文件

// index.js const helper = require("helper"); console.log(helper.add(1, 2));

执行打印

node index.js // 3

这种方式的使用比较简单，不过不够灵活，接下来使用gitlab官方的仓库注册表

Gitlab软件库

Gitlab支持包仓库注册了，也及时可以当做包仓库使用，需要版本14.0+，这里演示npm仓库注册表来管理npm包

注册表类型

gitlab支持两种的仓库注册表项目级别和示例级别(组级别)，两者对于包的上传没有什么影响，只是作用于包的安装，包的注册表名字是scope形式，也就是说包名是@scope/packageName这种形式

  • 实例级别：你可以理解为group级别，必须提供一个范围的scope名字，当你需要在不同的组创建包时，可以使用@scope/packageName 引入，你可以为不同的组设置权限，公开使用
  • 项目级别：注册表 URL仅针对该范围更新。在项目级别注册包时，您可以使用/附加您自己的唯一范围到您的包名称

发布准备

这里修改前面的仓库

// package.json { // 包名 "name": "@frontend-lib/helper", // 包版本 "version": "0.0.1", "description": "前端通用库", "main": "index.js", "keywords": [], "author": "", "license": "ISC" }

创建.npmrc文件：

#@scope:registry=https://your_domain_name/api/v4/projects/your_project_id/packages/npm/ #//your_domain_name/api/v4/projects/your_project_id/packages/npm/:_authToken="${NPM_TOKEN}" # 格式: # - scope：你的scopename # - your_domain_name：你的gitlab域名或ip # - your_project_id：你的仓库id # - NPM_TOKEN：用户发布的用户token # 示例 @frontend-lib:registry=http://192.168.10.10/api/v4/projects/4/packages/npm/ # 你可以直接将token写在这里 //192.168.10.10/api/v4/projects/4/packages/npm/:_authToken=HUzUdsos4WfnsgfUBi6j

记得忽略掉.npmrc追踪：

# .gitignore .npmrc

发布npm包

发布npm包可以手动发布也可以自动构建发布，两种方式都演示下。本次演示项目上传至github了

  • github.com/ihengshuai/g
  • github.com/ihengshuai/g

手动发布

创建token

如何部署本地的npm仓库？ 第4张

image-20230321124138019

拿到token后将其写入.npmrc文件中

# 如果没有将token写入npmrc，可以用命令行传入 NPM_TOKEN=HUzUdsos4WfnsgfUBi6j npm publish # 这里写入了npmrc，然后发布 ➜ npm publish npm notice npm notice @frontend-lib/helper@0.0.1 npm notice === Tarball Contents === npm notice 94B index.js npm notice 171B package.json npm notice 15B README.md npm notice === Tarball Details === npm notice name: @frontend-lib/helper npm notice version: 0.0.1 npm notice package size: 369 B npm notice unpacked size: 280 B npm notice shasum: 25bcde10511ed5f253bdf2761f86a92d62959847 npm notice integrity: sha512-0spZZ3DBZZhpM[...]yDmfOTOUq0rqQ== npm notice total files: 3 npm notice + @frontend-lib/helper@0.0.1

可以看到发布成功，并标记是手动发布

如何部署本地的npm仓库？ 第5张

image-20230321124452671

CI/CD自动构建npm包

以上便是手动发布npm包的整个流程，不过有很多不方便：

  • 存储发包token不能忘记
  • 手动执行

为了解决这些问题可以使用gitlab ci自动构建发布：

  1. 创建ci文件，指定发布到main指定分支时进行发包
    # .gitlab-ci.yml
    image: node:16-alpine

    stages:
    - deploy

    deploy_npm:
    stage: deploy
    only:
    - main
    tags:
    - testing
    script:
    - npm config set registry registry.npm.taobao.org
    - npm install
    - npm run build
    - echo "@frontend-lib:registry=192.168.10.10/api/v4/pr${CI_PROJECT_ID}/packages/npm/" > .npmrc
    - echo "//192.168.10.10/api/v4/projects/${CI_PROJECT_ID}/packages/npm/:_authToken=${NPM_TOKEN}" >> .npmrc
    - npm publish

  2. 创建换将CI变量NPM_TOKEN，将值设置为发包的token

如何部署本地的npm仓库？ 第6张

image-20230321134742476

  1. 为了防止后续开发可以删除本地.npmrc文件
  2. 修改版本号提交代码
    # package.json
    # version: 0.0.3

    git add .
    git cm -m 'add ci(#0)'
    git push

  3. 查看流水线执行情况

如何部署本地的npm仓库？ 第7张


如何部署本地的npm仓库？ 第8张

image-20230321135116085

  1. 查看仓库，这里我发了两次

如何部署本地的npm仓库？ 第9张


使用npm包

使用npm包你可以用根端点或项目端点

  1. 新建一个项目初始化，创建.npmrc文件，根据提示写入仓库地址：

如何部署本地的npm仓库？ 第10张


@frontend-lib:registry=192.168.10.10/api/v4/pa

# 如果你的项目或组需要权限才能访问就需要添加token
# //192.168.10.10/api/v4/projects/4/packages/npm/:_authToken=jev-72gFiNtp1JGTLZFn

❝ 这里你可以选择根配置或者项目级别的配置都可以
❞

  1. 下载npm包
    npm i @frontend-lib/helper

    # 示例
    ➜ npm i @frontend-lib/helper
    npm notice created a lockfile as package-lock.json. You should commit this file.
    npm WARN use-gitlab-npm@1.0.0 No description
    npm WARN use-gitlab-npm@1.0.0 No repository field.

    + @frontend-lib/helper@0.0.3
    added 1 package in 0.537s

    # 测试代码
    ➜ gitlab-npm node index.js
    5

❝ 如果你下载失败了如404、401，很大原因是没有权限，通过将项目或组的权限设置public解决，或者提供用户token就可以了
❞

参考文档

  • docs.gitlab.com/ee/user
  • docs.gitlab.com/ee/user
  • docs.gitlab.com/ee/user


Gitlab搭建npm仓库 | hengshuai's blog

END

免责声明：本文由卡卷网编辑并发布，但不代表本站的观点和立场，只提供分享给大家。

卡卷网

卡卷网 主页 联系他吧

请记住:卡卷网 Www.Kajuan.Net

相关推荐

欢迎 你 发表评论:

请填写验证码

最新文章

随机文章

广告位

广告
卡卷网

Copyright © 2024 Www.Kajuan.Net Corporation, All Rights Reserved 卡卷网版权所有

标签大全 Sitemap 成长史 留言板 广告合作 关于我们 鄂ICP备14005651号-8