当前位置: 首页 > news >正文

搭建内网开发环境(五)|基于nexus搭建npm私服

引言

在前面一篇教程中,通过 nexus 搭建了 maven 的私服,并通过脚本将本地的依赖文件批量上传到私服中,本文介绍通过 nexus 搭建 npm 私服,同样也通过脚本将本地依赖文件同步到私服中。

  • 搭建内网开发环境(一)|基于docker快速部署开发环境

  • 搭建内网开发环境(二)|Nexus安装及使用

  • 搭建内网开发环境(三)|基于nexus搭建docker私服

  • 搭建内网开发环境(四)|基于nexus搭建maven私服

创建 npm 私库

  1. 创建一个 **npm(hosted)**类型的私库

image.png

  1. 创建一个** npm(group)**仓库组对外服务,将本地的仓库 npm-hosted 添加到仓库组中,如果是外网情况可以在创建一个 proxy 类型的仓库添加在仓库组中。

image.png

收集 npm 依赖

  1. 找一个依赖比较多项目(尽量一次性同步大部分的依赖,后面进行相应补充就行),在有外网的环境中对代码进行编译生成 package-lock.json
  2. 打开 package-lock.json,从 resolved 字段中获取所有的 tgz 文件下载链接

image.png

  1. node-tgz-downloader

node-tgz-downloader 是一个根据 package-lock.json / package.json 文件下载所有 node_modules tgz 文件的工具包

  1. 安装 node-tgz-downloader:npm install node-tgz-downloader -g
  2. 下载 tgz 文件:download-tgz package-json path/to/package.json
  3. node-tgz-downloader 默认会在当前目录下生成一个 tarballs 文件夹,下载好的 tgz 都位于这个文件夹中

编写脚本批量收集并上传

nexus 提供了上传单个依赖组件的 API,通过这个 API 进行批量上传
image.png
将上述步骤编写成脚本,完成安装node-tgz-downloader -> 自动下载依赖 -> 收集 tgz -> 自动上传到私服。

  1. 创建一个文件夹来存放执行脚本、package.json 和生成的临时文件
    1. download_tgz.sh
#!/bin/bash
echo ">>> 开始下载项目依赖... <<<"
npm install
echo ">>> 项目依赖下载完成 <<<"
echo ">>> 开始安装 node-tgz-downloader <<<"
npm install node-tgz-downloader -g
echo ">>> node-tgz-downloader 安装完成 <<<"
echo ">>> 开始收集tgz文件... <<<"
download-tgz  package-json ./package.json
mkdir tgz
find ./tarballs -maxdepth 4 -name "*.tgz" -exec mv {} ./tgz/ \;
echo ">>> tgz文件收集完成 <<<"echo ">>> 清理中间文件 <<<"
rm -rf ./node_modules
rm -rf ./tarballs
echo ">>> 中间文件结束 <<<"
  2. upload.sh
#!/bin/bash# 替换下列 nexus 信息为真实信息
## nexus 账号
NEXUS_USER=admin
## nexus 密码
NEXUS_PWD=admin123
## 上传REST API repository后面要换成自己的仓库名称
UPLOAD_COMPONENT_API=10.0.0.3:8081/service/rest/v1/components?repository=npm-hostedTGZ_DIR=./tgz
dir=$(ls -l $TGZ_DIR | awk '/.tgz$/ {print $NF}')
cd $TGZ_DIR
for file in $dir
doecho ">>> $TGZ_DIR/$file 开始上传到npm私服 \n"# 替换resp=`curl -u $NEXUS_USER:$NEXUS_PWD -X POST "$UPLOAD_COMPONENT_API" -H "Accept: application/json" -H "Content-Type: multipart/form-data" -F "npm.asset=@$file;type=application/x-compressed"`echo respecho ">>> $TGZ_DIR/$file 上传完成 \n"
done
  1. 先执行 download_tgz.sh 脚本收集 tgz,在再执行 upload.sh 上传到 npm 私服
    1. 执行 download_tgz.sh:sh download_tgz.sh
    2. 执行 upload.sh:sh upload.sh,记得替换脚本中 nexus 的相关信息
    3. 可通过私服仓库对应的数量变化判断上传情况

image.png

使用私服

创建角色-用户

  1. 创建角色,创建一个前端开发者的角色 npm-publisher,并赋予 npm-hosted 的 读取、添加和修改权限

nx-repository-view-npm-npm-hosted-add
nx-repository-view-npm-npm-hosted-edit
nx-repository-view-npm-npm-hosted-read
image.png

  1. 创建用户,添加一个用户,并赋予 npm-publisher 角色

image.png

  1. 设置Realms,添加 npm Bearer Token Realm

image.png

配置私服地址

添加私服地址

可通过下面 两种方式进行配置,其中 nrm 方式需要先安装 nrm

  1. 通过 nrm add nexus [http://10.0.0.3:8081/repository/npm-repo/](http://10.0.0.3:8081/repository/npm-repo/)
  2. 通过 npm config set registry [http://10.0.0.3:8081/repository/npm-repo](http://10.0.0.3:8081/repository/npm-repo/)/ 设置为默认的仓库

登录私服

通过 npm login 登录私服 ,输入用户名、密码,即可登录成功

从私服下载依赖

如果按照已经设置默认 registry 为私服地址直接 npm i 即可,如果没有设置可直接指定,如:npm i axios --registry [http://10.0.0.3:8081/repository/npm-repo](http://10.0.0.3:8081/repository/npm-repo/)/

上传依赖到私服本地仓库

构建一个 package

  1. 通过 npm init 创建一个包,过程中需要填写参数如下
  • package name(名称)
  • version(版本)
  • description(描述)
  • entry point(主文件也就是入口地址)
  • test command(测试命令,可以先不指定)
  • git repository(git地址,这样就可以从npm官网直接点到git上,可以先不指定)
  • keywords(关键字,用于搜搜索)
  • author(作者)
  • license: (ISC)(包循的开源协议)

image.png

通过 npm publish 发布包

  1. 登录到私服本地仓库,npm login --registry=http://10.0.0.3:8081/repository/npm-hosted
  2. 发布 package 到私服,npm publish -registry http://10.0.0.3:8081/repository/npm-repo
  3. 查看仓库上传成功

image.png

结语

至此,在 nexus 中搭建 npm 私服成功,在本文中介绍了如下大搭建私服,并将本地 package 同步到私服上,另外演示如何在本地使用私服下载和上传 package。

相关文章:

  • IPage类与Page类区别和作用讲解
  • 【vim 学习系列文章 15.2 -- vim vimgrep 使用详细介绍】
  • WebRTC音视频开发读书笔记(六)
  • Go 语言并发--高级概述
  • 11.4k star! 部署清华开源的ChatGLM3,用私有化大模型无缝替换openai
  • 探索Python的工业通信之光:pymodbus的奇妙之旅
  • STM32时钟树配置
  • linux dig域名DNS 查询与iptables域名ip访问流量限制
  • 元素设置了sticky粘性布局后,关于滚动后怎么样让这个元素自动添加阴影,我用自定义指令实现
  • 4.3 数据操作语言(DML):增删改查操作
  • 牛客网SQL进阶135 :每个6/7级用户活跃情况
  • 【c++】通过Privilege类来保护数据
  • 【layui】layer弹出图片层(开启图片旋转 放大 缩小 还原)
  • PostgreSQL常用命令,启动连接,pg_dump导入导出
  • Python模块篇(五)
  • 【css3】浏览器内核及其兼容性
  • css选择器
  • Java程序员幽默爆笑锦集
  • miniui datagrid 的客户端分页解决方案 - CS结合
  • Python利用正则抓取网页内容保存到本地
  • XML已死 ?
  • 半理解系列--Promise的进化史
  • 从 Android Sample ApiDemos 中学习 android.animation API 的用法
  • 今年的LC3大会没了?
  • 实现简单的正则表达式引擎
  • 适配mpvue平台的的微信小程序日历组件mpvue-calendar
  • 要让cordova项目适配iphoneX + ios11.4,总共要几步?三步
  • 正则表达式小结
  • 智能网联汽车信息安全
  • linux 淘宝开源监控工具tsar
  • ​iOS安全加固方法及实现
  • $var=htmlencode(“‘);alert(‘2“); 的个人理解
  • ( )的作用是将计算机中的信息传送给用户,计算机应用基础 吉大15春学期《计算机应用基础》在线作业二及答案...
  • (16)Reactor的测试——响应式Spring的道法术器
  • (3) cmake编译多个cpp文件
  • (3)选择元素——(14)接触DOM元素(Accessing DOM elements)
  • (Java实习生)每日10道面试题打卡——JavaWeb篇
  • (动手学习深度学习)第13章 计算机视觉---图像增广与微调
  • (二十三)Flask之高频面试点
  • (附源码)ssm经济信息门户网站 毕业设计 141634
  • (机器学习-深度学习快速入门)第三章机器学习-第二节:机器学习模型之线性回归
  • (力扣记录)235. 二叉搜索树的最近公共祖先
  • (每日一问)基础知识:堆与栈的区别
  • (面试必看!)锁策略
  • (使用vite搭建vue3项目(vite + vue3 + vue router + pinia + element plus))
  • (游戏设计草稿) 《外卖员模拟器》 (3D 科幻 角色扮演 开放世界 AI VR)
  • (原创)攻击方式学习之(4) - 拒绝服务(DOS/DDOS/DRDOS)
  • (转)C#开发微信门户及应用(1)--开始使用微信接口
  • ./和../以及/和~之间的区别
  • .md即markdown文件的基本常用编写语法
  • .NET Core中Emit的使用
  • .NET Micro Framework 4.2 beta 源码探析
  • .net mvc actionresult 返回字符串_.NET架构师知识普及
  • .NET/C# 编译期间能确定的相同字符串,在运行期间是相同的实例
  • .NET/MSBuild 中的发布路径在哪里呢?如何在扩展编译的时候修改发布路径中的文件呢?