Gitlab搭建npm仓库

embedded/2025/1/18 23:27:04/

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

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

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

创建组与项目

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

  1. 创建组
    image-20230321112321027
  2. 创建项目
    image-20230321112503456
    image-20230321112816193

初始化项目

本地创建一个简单的项目,推送到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 initcat > .gitignore << EOF
node_modules
.DS_Store
EOFgit 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_186">发布npm

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

  • https://github.com/ihengshuai/gitlab-practice/tree/main/gitlab-frontend-helper-lib
  • https://github.com/ihengshuai/gitlab-practice/tree/main/gitlab-npm

手动发布

创建token

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

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

image-20230321124452671

npm_227">CI/CD自动构建npm

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

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

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

  1. 创建ci文件,指定发布到main指定分支时进行发包

    # .gitlab-ci.yml
    image: node:16-alpinestages:- deploydeploy_npm:stage: deployonly:- maintags:- testingscript:- npm config set registry https://registry.npm.taobao.org- npm install- npm run build- echo "@frontend-lib:registry=http://192.168.10.10/api/v4/projects/${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

    image-20230321134742476

  3. 为了防止后续开发可以删除本地.npmrc文件

  4. 修改版本号提交代码

    # package.json
    # version: 0.0.3git add .
    git cm -m 'add ci(#0)'
    git push
    
  5. 查看流水线执行情况
    image-20230321135048568

    image-20230321135116085

  6. 查看仓库,这里我发了两次
    image-20230321135219054

npm_286">使用npm

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

  1. 新建一个项目初始化,创建.npmrc文件,根据提示写入仓库地址:
    image-20230321140703921

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

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

  2. 下载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就可以了

参考文档

  • https://docs.gitlab.com/ee/user/packages/package_registry/
  • https://docs.gitlab.com/ee/user/packages/npm_registry/
  • https://docs.gitlab.com/ee/user/packages/yarn_repository/

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

📷

在这里插入图片描述


http://www.ppmy.cn/embedded/155073.html

相关文章

Python爬虫学习前传 —— Python从安装到学会一站式服务

早上好啊&#xff0c;大佬们。我们的python基础内容的这一篇终于写好了&#xff0c;啪唧啪唧啪唧…… 说实话&#xff0c;这一篇确实写了很久&#xff0c;一方面是在忙其他几个专栏的内容&#xff0c;再加上生活学业上的事儿&#xff0c;确实精力有限&#xff0c;另一方面&…

C 语言运算符的优先级和结合性

运算符的结合性和优先级 优先级运算符描述结合性1()[]->.函数调用、数组下标、结构体 / 联合体成员通过指针访问、结构体 / 联合体成员访问从左到右2!~ (前缀)-- (前缀) (一元)- (一元)* (间接寻址)& (取地址)sizeof(type)逻辑非、按位取反、前缀自增、前缀自减、一元正…

微服务学习-快速搭建

1. 速通版 1.1. git clone 拉取项目代码&#xff0c;导入 idea 中 git clone icoolkj-microservices-code: 致力于搭建微服务架构平台 1.2. git checkout v1.0.1版本 链接地址&#xff1a;icoolkj-microservices-code 标签 - Gitee.com 2. 项目服务结构 3. 实现重点步骤 …

以太坊(概念与原理)

特点 以太坊是”世界计算机“&#xff0c;开源的、全球分布的计算机基础设施。执行称为智能合约的程序使用区块链来同步和存储系统状态以及名为以太币的加密货币&#xff0c;以计量和约束执行资源成本本质是一个基于交易的状态机以太坊平台使开发人员能够构建具有内置经济功能…

Mac的`~键打出来±§`?解析ANSI、ISO、JIS键盘标准的区别与布局

注&#xff1a;本文由deepseek生成&#xff0c;只进行了基本的校对。 引言 在使用Mac时&#xff0c;你是否遇到过这样的问题&#xff1a;按下~键&#xff0c;却输出了或&#xff1f;这其实是因为你的键盘类型设置与物理键盘布局不匹配。Mac支持多种键盘标准&#xff0c;包括A…

python之二维几何学习笔记

一、概要 资料来源《机械工程师Python编程&#xff1a;入门、实战与进阶》安琪儿索拉奥尔巴塞塔 2024年6月 点和向量&#xff1a;向量的缩放、范数、点乘、叉乘、旋转、平行、垂直、夹角直线和线段&#xff1a;线段中点、离线段最近的点、线段的交点、直线交点、线段的垂直平…

基于华为云车牌识别服务设计的停车场计费系统【华为开发者空间-鸿蒙】

文章目录 手把手的技术干货教程&#xff0c;记录从0到1的开发过程。一、前言1.1 内容简介1.2 云主机1.3 开发环境1.4 功能说明 二、华为云开发者空间2.1 进入开发者空间2.2 配置云主机2.3 安装系统2.4 启动云主机2.5 全屏切换2.6 共享桌面2.5 测试Python开发环境2.6 安装reques…

Ubuntu20.4和docker终端指令、安装Go环境、安装搜狗输入法、安装WPS2019:保姆级图文详解

目录 前言1、docker、node、curl版本查看终端命令1.1、查看docker版本1.2、查看node.js版本1.3、查看curl版本1.4、Ubuntu安装curl1.5、Ubuntu终端保存命令 2、安装docker-compose、Go语言2.1、安装docker-compose2.2、go语言安装步骤2.3、git版本查看 3、Ubuntu20.4安装搜狗输…