随着公司业务的发展,我们经常会积累并封装一套公共组件库或者自定义脚手架,这些工具极大地加速了我们的业务开发流程。但是出于对代码安全和公司隐私的考虑,我们不能将这些内容上传到公开的npm仓库中,这时候我们就可以利用Verdaccio工具,在公司的服务器中搭建一个npm私服,来帮助我们更好的管理公司内部的共享代码。
Verdaccio 是一款开源的、轻量级的、易于配置的 npm 私服解决方案。它基于 Node.js 和 Express.js 构建,提供了与官方 npm 仓库相似的使用体验,同时允许我们根据实际需求进行定制和扩展。通过 Verdaccio,我们可以轻松地在本地或云端搭建一个私有的 npm 仓库,实现包的快速访问、版本控制、权限管理等功能。
安装node
从NodeJs官网下载linux版本的压缩包,将压缩包上传到服务器的/usr/local/目录下。
然后在/usr/local/目录下解压nodejs压缩包:
cd /usr/local/
tar -xvf node-v16.20.2-linux-x64.tar.xz
解压完成:
将解压后的文件目录修改为nodejs【后续方便】:
mv node-v16.20.2-linux-x64 nodejs
然后配置软链接【即windows系统的环境变量】:
ln -s /usr/local/nodejs/bin/node /usr/bin/node
ln -s /usr/local/nodejs/bin/npm /usr/bin/npm
使用查看版本号的命令,即可校验是否配置成功:
查看当前npm全局安装的依赖列表:
npm list -g --depth=0
安装Verdaccio
1.全局安装
使用npm命令全局安装Verdaccio:
npm install -g verdaccio --registry=https://registry.npmmirror.com
使用淘宝镜像地址提高资源安装速度。
安装完成之后启动verdaccio应用:
verdaccio
此时会报出错误提示:-bash: verdaccio: command not found。
2.配置PATH环境变量
此时我们同样需要像npm一样为verdaccio配置软链接:
# 建立软链接
ln -s /usr/local/nodejs/bin/verdaccio /usr/bin/verdaccio
假如我们不小心配置了错误的软链接路径,可以先删除现有的软连接:
# 建立软链接
rm /usr/bin/verdaccio
然后输入正确的地址,重新执行一遍上面的命令建立新的软链接。
最后我们可以查看当前存在的软链接:
ls -l /usr/bin/verdaccio
再次执行命令启动verdaccio:
verdaccio
启动成功:首次启动会初始化它的一些配置文件。
3.访问应用
在访问应用之前,我们还需要做两个操作:
检查verdaccio 的config.yaml配置文件是否监听了4873端口。
在阿里云服务器防火墙开放4873端口。
1.找到config.yaml配置文件,使用vi命令编辑文件:
vi /verdaccio/config.yaml
最好是在修改之前请先备份一个配置文件。
首先如果config.yaml配置文件没有开启监听,则我们需要手动开启。
listen: 0.0.0.0:4873
以下是一个基本的 config.yaml 配置文件示例。
storage: ./storage
auth:
htpasswd:
file: ./htpasswd
uplinks:
npmjs:
url: https://registry.npmjs.org/
packages:
'@*/*':
# scoped packages
access: $all
publish: $authenticated
unpublish: $authenticated
proxy: npmjs
'**':
# all other packages
access: $all
publish: $authenticated
unpublish: $authenticated
proxy: npmjs
logs:
- { type: stdout, format: pretty, level: http }
listen: 0.0.0.0:4873
完成编辑后,按Esc键退出插入模式,回到命令模式,然后输入:wq并按Enter键保存并退出vi编辑器。
修改配置文件后,重新启动Verdaccio :
verdaccio
注意:yaml文件对缩进和格式非常敏感,如果在执行verdaccio命令启动应用时有如下报错:
cannot open config file /verdaccio/config.yaml: false
大部分情况都是在编辑yaml文件时出现了格式错误。
2.我们还需要在阿里云服务器的防火墙开放4873端口:
最后通过服务器公网IP地址加默认的端口即可访问Verdaccio 首页。
http://ip:4873/
到目前为止,我们就已经成功的安装并访问了verdaccio应用。
域名解析
通过ip地址访问并不是一个优雅的方式,我们还需要进行域名解析和配置nginx反向代理。
http://npm.xx.com/
首先我们需要在阿里云服务器配置DNS解析,将npm.xx.com域名解析到我们的服务器IP地址。
然后在nginx.conf配置反向代理。
server {
listen 80;
server_name npm.xx.com;
location / {
proxy_pass http://ip:4873;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
}
修改配置文件后,我们再重启nginx:
sudo systemctl restart nginx
最后通过http://npm.xx.com即可成功访问verdaccio首页。
遇到502 Bad Gateway错误通常意味着Nginx服务器作为反向代理尝试连接到上游服务器(比如Verdaccio),但是连接失败了,别忘记启动verdaccio服务。
发布npm包
1.创建账号
使用vite构建Vue3组件库,发布npm包 <--点击访问
在发布npm包之前,我们还需要在verdaccio创建一个账号。
verdaccio采用了htpasswd的认证方式,我们可以通过以下命令来创建账号:
htpasswd -c ./htpasswd weibo
执行这个命令后,系统会提示输入并确认用户的密码。-c选项用于创建新的htpasswd文件;如果文件已经存在,就应该去掉-c选项,以避免覆盖现有文件。
如果系统没有自带htpasswd程序,则会提示-bash: htpasswd: command not found。
可以通过以下命令进行安装:
sudo yum install httpd-tools
安装过程中,系统会询问您是否继续安装。输入y并按Enter键以确认安装。
安装完成后,再次执行上面的创建账号命令:
这将在当前目录下创建一个名为htpasswd的文件,并提示您为账号设置密码。
创建完成后,我们可以在verdaccio首页进行登录测试。
登录成功说明我们上面的账号已经创建成功。
2.本地发布
在本地创建一个my-cli测试包:
my-cli
|—— index.js
|—— readme.md
|—— package.json
在本地创建新的用户:
npm adduser --registry http://npm.xx.com/
执行发布命令:
npm publish --registry http://npm.xx.com/
最后刷新http://npm.xx.com首页,即可看到我们当前发布的npm包。
到此为止,我们使用verdaccio搭建Npm私服就已完成
我希望这篇文章对您有所帮助。
Thank you for reading.