如何在阿里云服务器搭建属于自己的Verdaccio呢?

背景

最近在封装自己的组件的时候,发现所有的项目都需要应用一个组件的时候,需要每一个组件CV大法,但这在一定程度上加大了维护的成本,后期一个项目优化,其他项目需要同步升级。查阅了大量资料,学习了一下verdaccio的部署。

流程

这里我的阿里云服务器使用的是CentOS的系统,所以这里使用命令行进行配置。

首先我们需要在新的系统上安装node环境,文件下载在/usr/local下,命令如下:
sh 复制代码
cd /usr/local
// 下载所需版本
wget https://nodejs.org/dist/v14.15.1/node-v14.15.1-linux-x64.tar.gz
// 解压
tar -zxvf node-v14.15.1-linux-x64.tar.gz 
// 重命名文件夹
mv node-v14.15.1-linux-x64 node-v14.15.1
添加环境变量,刷新配置信息
sh 复制代码
// 编辑环境变量配置
vi /etc/profile
// 在文件最下面加入下面的配置
export NODE_HOME=/usr/local/node-v14.15.1
export PATH=$PATH:$NODE_HOME/bin
// 刷新配置信息
source /etc/profile

这里我们可以使用node -vnpm -v查看安装的node是否成功。为了加快包资源的下载速度,我们可以切换镜像源npm config set registry "https://registry.npm.taobao.org"

在服务器全局安装verdaccio
sh 复制代码
npm install -g verdaccio --unsafe-perm
进入verdaccio配置目录,修改配置信息
sh 复制代码
cd /root/.config/verdaccio

在配置文件底部加上listen: 0.0.0.0:4873,使其可在外网访问

开放4873端口,使其能够通过ip+端口的形式进行浏览器访问
sh 复制代码
firewall-cmd --state  // 先查看防火墙状态,
service firewalld start  // 开启防火墙
firewall-cmd --zone=public --add-port=4837/udp --permanent
firewall-cmd --zone=public --add-port=4837/tcp --permanent // 开放4873端口
firewall-cmd --reload // 重新载入
firewall-cmd --zone=public --query-port=4873/tcp  // 查看是否添加成功

如果返回的是yes,说明端口开通成功。

这时候,服务器上的配置就配好了,我们可以开启verdaccio了
sh 复制代码
verdaccio
我通过ip+端口号的方式,并没有进入自己预想中的页面,这是因为我们需要在阿里云的访问规则添加我们的4837端口,添加方式如下:

到这里,我们可以再重新请求一下试试,这里是请求成功了。

但是还有一个问题就是,启动verdaccio之后,我们的控制台无法进行其他操作,如果打断,我们的verdaccio服务也就无法访问了。这时候我们就需要引入进程守护了,我这里使用pm2进行托管。
sh 复制代码
npm install -g pm2 --unsafe-perm // 全局安装pm2
pm2 start `which verdaccio` // 通过pm2启用verdaccio

控制台效果如下:

注册用户信息,注册verdaccio
sh 复制代码
npm adduser --registry http://192.168.XX.XX:4873

这时候,我们就有了发布包的权限了,当然如果你要限制用户注册,可以根据verdaccio官方提供的API进行配置,这里就不加以赘述了。

相关推荐
Codebee1 小时前
OneCode 组件服务通用协议栈:构建企业级低代码平台的技术基石
前端·前端框架·开源
我命由我123451 小时前
Vue 开发问题:Missing required prop: “value“
开发语言·前端·javascript·vue.js·前端框架·ecmascript·js
小Lu的开源日常2 小时前
在 Mac 上使用 iTerm2 和 Oh My Zsh 打造优雅终端
macos·iterm·命令行
扶我起来还能学_2 小时前
uniapp Android&iOS 定位权限检查
android·javascript·ios·前端框架·uni-app
沐森6 小时前
桌面右键功能开发
前端框架·操作系统
默默地离开7 小时前
React自定义 Hooks 不用死磕,轻松拿捏也能站上技术金字塔尖!
前端·react.js·前端框架
知识分享小能手18 小时前
Vue3 学习教程,从入门到精通,使用 VSCode 开发 Vue3 的详细指南(3)
前端·javascript·vue.js·学习·前端框架·vue·vue3
前端小趴菜0520 小时前
react状态管理库 - zustand
前端·react.js·前端框架
Thomas游戏开发1 天前
Unity3D Boehm GC原理解析
前端框架·unity3d·游戏开发
不见_1 天前
不想再写周报了?来看看这个吧!
前端·命令行