npm私有仓库搭建【verdaccio】

2019-12-12  本文已影响0人  前端菜篮子

大体搭建步骤转自: npm私有仓库搭建

而大部分截图来自亲测操作过程

一、首先需要安装node环境

1、下载,https://nodejs.org/en/

2、下载后,一直下一步,就可以安装了(傻瓜式安装)

3、打开命令窗口,执行node -v命令检测nodejs是否安装成功,成功如图显示:

image.png

4、执行npm install -g npm,更新nodejs版本,不然可能会出错。

二、安装python环境

1、下载,https://www.python.org/downloads/release/python-2715/

2、选择对应电脑系统版本,红色标记为windows64

image.png

3、下载之后安装到指定位置

4、在环境变量中配置python变量,如图(C:\D\Python27python的安装路径):

image

5、检测python环境是否搭建好,在命令窗口中执行python -v,结果如图所示即成功:

image.png

三、搭建私人仓库

私有仓库可先的方案有多种
一、购买npm官方私有仓库服务:要花钱,服务器在国外,代码保存在别人手里。
二、cnpm,阿里的,功能非常强大,功能强大的背后就是配置及安装维护也相对复杂
三、sinopia,这个是一个小巧的工具,2015年的时候已经停止维护了。
四、Nexusnpm私有仓库搭建【Nexus】:允许传较大的包
五、verdaccio(此文选择这一种),sinopia的后继者,使用简单,口碑不错,目前持续更新。 不过这种方式可能允许上传的包不能太大吧

1、安装verdaccio,使用npm 全局安装即可。npm install –global verdaccio

2、安装完成后,直接输入verdaccio命令即可运行

image.png

注意,上图中第一个warn对应的config.yaml文件是默认的配置文件,4873端口表示默认端口,使用过程中,我们可以通过修改默认的配置文件来符合我们的需求。默认配置如下所示:

image.png image.png image.png
//常用配置项:
storage: 仓库保存的地址,
    也是发布组件(npm publish)时仓库保存的地址 。

auth: htpasswd file:账号密码的文件地址,
    初始化时不存在,可指定需要手动创建。

max_users:默认1000,为允许用户注册的数量。
    为-1时,不允许用户通过npm adduser注册。
    为-1时,可以通过直接编写htpasswd file内容的方式添加用户。
                  htpasswd file有且只有一个用户

uplinks: 配置上游的npm服务器,
    主要用于请求的仓库不存在时到上游服务器去拉取。

packages: 配置模块。

access:访问下载权限,publish包的发布权限。

3、修改完再次输入verdaccio 命令启动,使用forever进程守护verdaccio

4、安装forever该包的作用是守护进程):npm install forever -g

5、创建脚本(该脚本的作用是:进入到verdaccio全局包目录下,执行forever start cli.js

image.png

6、执行这个脚本,访问http://localhost:4873,如果成功即为服务部署成功。【C:\Users\user\AppData\Roaming\Microsoft\Windows\Start Menu\Programs\Startup(可以将执行脚本放到该目录下,此路径为开机自动执行文件路径,不放该目录下则手动执行)】

image.png

四、客户端如何使用

1、先安装 nrm(npm registry manager ):是npm的镜像源管理工具,有时候国外资源太慢,使用这个就可以快速地在 npm 源间切换, 安装命令如下:npm install -g nrm

2、添加源:你可以增加定制的源,特别适用于添加企业内部的私有源,执行命令 nrm add <registry> <url>,其中reigstry为源名,url为源的路径。如:nrm add verdaccio http://127.0.0.1:4873(具体ipport根据实际情况)

image.png

3、使用nrm ls指令查看所有镜像源地址。其中,带*的是当前使用的源。

image.png

4、可以使用 nrm use xx命令切换源

image.png

5、删除对应的源:nrm del <registry>

6、测试相应源的响应时间:nrm test <registry>

image.png

五、当前npm服务指向

1、npm set registry http://127.0.0.1:4873# 注册用户
【查看npm下载包的源地址:npm config get registry

image.png

2、npm adduser -registry http://127.0.0.1:4873
按照提示输入userNamepassword,email,输入后就注册完成

image.png

3、查看当前用户,是否是注册用户:npm who am i

image.png

4、如已有账户进行登录

image.png

5、最后一步就是创建一个文件夹,按照npm publish 的标准格式,创建一个私有的package(进入要发布的包文件目录下),每次发布相同名字的包注意修改版本号,否则会报版本错误。

六、发布包

1、npm publish将自己的vue组件发布为npm包

image.png

注意点:原先本人已经将该包传至npm官网,最后的版本号为1.0.1,那么如果不修改该版本号,则会报错(已存在的版本号)

image.png
修改版本号为1.0.2,重新发布 image.png

2、成功发布了一个私有的包,就可以在其他模块里面使用npm install [package name]来安装了, 而私有npm 里面不包含的包,例如你要安装一个vue ,webpack 这样的包,找不到的话,会被代理到 npm.js 官网去下载,并且会帮你缓存在 ./storage 文件夹里面. 再次下载,就能体验飞一般的速度了,当一个小团队使用的时候效果更佳。

3、注意注意:npm install [package name] 这个包名不带的话,应该是不会缓存到你的./storage 。暂时未下载自己上传的包,直接npm install 未看到有缓存包。

image.png image.png

4、使用yarn上传下载包

    a. 使用`npm install -g yarn`命令安装yarn
    b. 创建一个yarn模板,到一个文件夹目录下,执行初始化`yarn init`
    c. 发布命令`yarn publish`
    d. 下载包 `yarn add` [需要下载的包名]

对上述文章的转载说明:
作者:nayli
链接:https://www.jianshu.com/p/cf2e9f580e6d
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。


PS: npm install -global verdaccio时报如下错:

image.png

有人说:npm install --global --production windows-build-tools 即可。
有人说要安装:Microsoft Visual Studio Express 2013 for Windows Desktop


还有这个文章可以看看: 5分钟内3种方法搭建企业内部私有npm仓库

上一篇下一篇

猜你喜欢

热点阅读