npm私服搭建—verdaccio方案及其最佳实践

简介: 如今前端圈已十分繁荣,一个跟得上技术时代脚步的互联网公司必定是前后端分离的(至少在狭义上是分离的),这就导致了前端承受的分工压力会越来越大,很多公司的前端项目变得十分庞杂,因此技术负责人可能会考虑根据业务线进行拆分为几个工程系统,这样又引申出一个问题:这几个系统之间如何共用一套公司内部的组件库呢?

为什么要搭建公司内部的npm服务?



如今前端圈已十分繁荣,一个跟得上技术时代脚步的互联网公司必定是前后端分离的(至少在狭义上是分离的),这就导致了前端承受的分工压力会越来越大,很多公司的前端项目变得十分庞杂,因此技术负责人可能会考虑根据业务线进行拆分为几个工程系统,这样又引申出一个问题:这几个系统之间如何共用一套公司内部的组件库呢?每个工程里面都copy一套肯定不行,做一个小修改要同步几个工程,繁琐且容易出错。上传到npm库是个很不错的选择,不同的系统都指向一个npm源,然后通过npm install就行,快速且“干净”,所以在这种场景下,搭建一套公司内部的npm库就显得很有必要。简单来说,npm私服主要优势其实就两个:


托管公司内部组件库代码,不对外,方便管理

项目中使用到的npm包会缓存到私服库里,能明显提升之后下包的速度


为什么选择verdaccio



网上主要有几种搭建企业npm私服的方式,简单罗列一下:


付费选择:
MyGet (https://www.myget.org) 9美元/月,且只能有两个账号和1GB的存储空间。
NPM Org (https://www.npmjs.com) 每个账号每月7美元
免费选择:
DIY NPM (https://docs.npmjs.com/misc/registry)
Git,这也是一种选择,在package.json中指定git仓库的URL即可,但是这种做法有些别扭,第一,使得package.json不够优雅,第二,当git仓库为private时,你需要HTTPS或SSH凭据,而且通常我们并没有每个团队的权限。
Sinopia (https://www.npmjs.com/package/sinopia)
Cnpmjs.org (https://github.com/cnpm/cnpmjs.org)

付费的我们就不考虑了,没这个必要,而且付费的也不是就更好。sinopia搭建十分简单友好,不过这玩意儿已经停止维护了,最近的更新在4年前,但有一群人出了sinopia的一个分支,起了个名字叫verdaccio,这个就是这次主要推荐的方案,这个库一直在积极维护中,github start 7000+,看来还是比较靠谱的,而且国内外各种资料参考下来,这个方案也是受到极力推荐的。verdaccio搭建私服很简单,相比于cnpm搭建,还需要安装配置mysql,这个绝对会少走一些坑。
image.png


搭建步骤


首先我们需要向运维同学申请一台linux服务器,给台2GB左右的虚拟机就够用了;
找个合适的地方下载安装nodejs,比如在/usr/local/lib下
安装wget:yum install -y wget;(已经安装的跳过这步)
下载:wget https://nodejs.org/dist/v10.6.0/node-v10.6.0-linux-x64.tar.xz;
解压:tar -xvf node-v10.6.0-linux-x64.tar.xz;
重命名安装目录:mv node-v10.6.0-linux-x64 nodejs;
建立软连接:
ln -s /usr/local/lib/nodejs/bin/npm /usr/local/bin/
ln -s /usr/local/lib/nodejs/bin/node /usr/local/bin/
执行node -v和 npm -v命令检查是否安装成功
全局安装verdaccio:npm i verdaccio -g;
全局安装pm2,用来守护node进程:npm i pm2 -g;
安装nginx,仍然在 /usr/local/lib下
下载:wget http://nginx.org/download/nginx-1.13.7.tar.gz
解压:tar -zxvf nginx-1.13.7.tar.gz;
换个名字:mv nginx-1.13.7 nginx;
进入安装目录:cd nginx
执行:./configure;
执行:make && make install;
cd conf/修改nginx.conf,加上这一段:
server {
listen       80;
server_name  registry.npm.your.server;
location / {
proxy_pass    http://127.0.0.1:4873/;
proxy_set_header        Host $host;
}
}


建立软连接:ln -s /usr/local/nginx/sbin/nginx /usr/local/bin/
启动nginx: sudo nginx
(重启命令:sudo nginx -s reload)


pm2启动服务,执行pm2 start verdaccio,然后浏览器访问http://服务器IP,出现以下页面则代表安装成功。
image.png


verdaccio使用方式


verdaccio允许任何人创建账号,若没有配置verdaccio的配置文件config.yaml,则默认任何注册了verdaccio的开发都有publish权限。看个实例:


添加一个用户:npm adduser --registry http://172.16.14.5:
image.png
给要添加到服务的工程添加源信息,在工程根目录下新建.npmrc文件,添加以下内容:
registry=http://172.16.14.5/
package.json中设置好版本,执行npm publish:


image.png


此时再访问http://172.16.14.5,该工程已出现在列表中:
image.png
verdaccio最佳实践


上述publish仓库的步骤很简单,创建用户 -> 设置npm源 -> npm publish。但这样并不是我们想要的流程,我们想要的是publish权限可把控,这当然是可以做的。


  1. 查看config.yaml配置文件
    一般来说此配置文件在/创建用户/.config/verdaccio中,如果你不确定,你可以直接在服务器上执行verdaccio命令,第一个config file即文件所在位置.
    image.png


这个目录下有两个文件及一个目录:
image.png


打开config.yaml,查看packages项,原始内容为:

packages:
'@/':
# scoped packages
access: $all
publish: $authenticated
unpublish: $authenticated
proxy: npmjs
'**':
# allow all users (including non-authenticated users) to read and
# publish all packages
#
# you can specify usernames/groupnames (depending on your auth plugin)
# and three keywords: "
anonymous", "$authenticated"
access: $all
# allow all known users to publish/publish packages
# (anyone can register by default, remember?)
publish: $authenticated
unpublish: $authenticated
# if package is not available locally, proxy requests to 'npmjs' registry
proxy: npmjs

字段含义:
scope有两种模式
一种是 @/ 表示某下属的某项目
另一种是 * 匹配项目名称(名称在package.json中有定义)
权限:


access: 表示哪一类用户可以对匹配的项目进行安装(install)

publish: 表示哪一类用户可以对匹配的项目进行发布(publish)

proxy: 如其名,这里的值是对应于 uplinks 的名称,如果本地不存在,允许去对应的uplinks去取。


值的含义:


$all 表示所有人(已注册、未注册)都可以执行对应的操作

$authenticated 表示只有通过验证的人(已注册)可以执行对应操作,注意,任何人都可以去注册账户。

$anonymous 表示只有匿名者可以进行对应操作(通常无用)


如果要指定某个用户才有权限,可以直接写上用户名,多个用户用空格隔开,比如:
publish: michael martin


修改完成后请重启nginx和pm2。当前已存在的用户列表可在htpasswd文件中查看。
下载包及缓存仓库


在指定源为内网源的工程下,通过npm install就能下载内网的库了。我们内部的仓库存储在storage目录里,进入storage中,可以看到这里存储了我们使用过的库:
image.png


其中testpro是我们内部的库,进入库中,可以看到我们发布的所有版本都在这里以压缩包的形式存储着


image.png
参考

Ways to have your private npm registry
https://verdaccio.org/docs/en/what-is-verdaccio




相关文章
|
缓存 资源调度 运维
从零到一搭建私有NPM服务器
从零到一搭建私有NPM服务器
1407 0
从零到一搭建私有NPM服务器
|
安全 NoSQL 关系型数据库
使用cnpm搭建企业内部私有NPM仓库
cnpm是企业内部搭建npm镜像和私有npm仓库的开源方案。它同时解决了现有npm架构的一些问题。
866 0
使用cnpm搭建企业内部私有NPM仓库
|
JavaScript
vue-element-admin 安装依赖 npm install 报错ERESOLVE unable to resolve dependency tree解决方案
vue-element-admin 安装依赖 npm install 报错ERESOLVE unable to resolve dependency tree解决方案
|
JavaScript Shell API
jsdelivr cdn npm替代方案
jsdelivr cdn npm替代方案
289 0
|
数据安全/隐私保护 iOS开发 MacOS
verdaccio:搭建npm私有服务器--原来这么简单
verdaccio:搭建npm私有服务器--原来这么简单
752 0
verdaccio:搭建npm私有服务器--原来这么简单
|
JavaScript 数据安全/隐私保护
从0到1搭建一款Vue可配置视频播放器组件(Npm已发布)
从0到1搭建一款Vue可配置视频播放器组件(Npm已发布)
从0到1搭建一款Vue可配置视频播放器组件(Npm已发布)
|
应用服务中间件 数据库 nginx
|
C++ 计算机视觉 开发者
VS Code项目中通过npm包的方式共享代码片段的方案实现
上周在 “VS Code项目中共享自定义的代码片段方案” 的文章中提到过一个共享代码片段的方案,上周经过调研后并没有发现现成的插件,就抽了点空实现了这个方案,最终产出Share Snippets 这个插件去实现这个设想
|
资源调度 应用服务中间件 Linux
npm私服安装教程 - verdaccio 入门
笔者安装的是 verdaccio@3.2.0,需要 node > 6.12.0, npm >=3.x 我们使用 pm2 来管理进程,需要全局安装 pm2
440 0

推荐镜像

更多