verdaccio:搭建npm私有服务器–原来这么简单

  • Post author:
  • Post category:其他




1、为什么要搭建npm 服务器

1、公司内部开发的私有包,统一管理,方便开发和使用,自然也可以使用npm 的付费服务,原谅我们的穷。

2、安全性,由于公司内部开发的模块和一些内容并不希望其他无关人员能够看到,但是又希望内部能方便使用。

于是npm私有服务器的搭建就提上了日程。



2、搭设环境


本人搭建环境:


1、macOS系统

2、npm安装与更新

// 检查npm版本
npm -v

//使用 npm 安装 最新的 npm最新的版本
npm install npm@latest -g

// 如果不能更新到最新版本,可能是node版本太低,需要先更新node版本
去[node官网下载](https://nodejs.org/zh-cn/),然后更新

检查node是否更新到最新版本
node -v

// 其最新版本为:
v16.13.1

成功之后,再执行更新npm版本,基本没问题了,最后我npm版本为:8.3.0

3、

python安装及环境配置(我安装的是2.7.18)



3、调研

业界主流的私有npm仓库搭建的主流方案有如下几种:

1、付费购买

2、 使用 git+ssh 这种方式直接引用到 GitHub 项目地址

3、使用 npmjs.org

4、使用 verdaccio

第一种,需要付费,并且npm在国内访问很慢,就是花钱也买不到好的体验。

第二种,不能更新即 npm update, 不能使用semver(语义化版本规范)。

那么较好的选择就只剩下第三种和第四种。

第三种方案还是npmjs平台搭建自己的私有库,组件包的发布可以借鉴

npm关于组件包的发布与管理


后文说明是采用方案四搭建自己的本地私有库:





4、服务端搭设



4.1、安装

使用npm安装即可,在命令窗口输入:

npm install --global verdaccio



4.2、运行

在命令窗口输入:

verdaccio

显示如下:

请添加图片描述

这时候我们打开浏览器输入 http://localhost:4873/ 即可打开。

请添加图片描述



4.3、配置文件说明

  • 在启动的时候,上面可以看到,进入配置文件【config.yaml 】的路径,其内容和说明如下:
#
# #号后面是注释

# 这是默认的配置文件。
# 它允许所有用户做任何事,所以不要在生产系统上使用它。
#
# 这里有更多配置文件的例子:
# https://github.com/verdaccio/verdaccio/tree/master/conf
#

# 所有包的缓存目录
storage: /Users/chenzimin/.local/share/verdaccio/storage
# 插件目录
plugins: ./plugins


#开启web 服务,能够通过web 访问
web:
  title: Verdaccio
  # 注释掉以禁用gravatar支持
  # gravatar: false
  # 默认情况下,包是orderer ascendant (asc|desc)
  # sort_packages: asc
  # 将你的UI转换成黑暗模式
  # darkMode: true
  # logo: http://somedomain/somelogo.png
  # 网站图标(favicon): http://somedomain/favicon.ico | /path/favicon.ico
  # rateLimit:
  #   windowMs: 1000
  #   max: 10000


#验证信息
auth:
  htpasswd:
    # 用户信息存储目录
    file: ./htpasswd
    # 允许注册的最大用户数,默认为“+inf”。
    # 您可以将此设置为-1以禁用注册。
    # max_users: 1000

# 可以联系的其他已知存储库列表
#公有仓库配置
uplinks:
  npmjs:
    url: https://registry.npmjs.org/

packages:
  '@*/*':
    # scoped packages
    access: $all
    publish: $authenticated
    unpublish: $authenticated
    
    #代理 表示没有的仓库会去这个npmjs 里面去找 ,
    #npmjs 又指向  https://registry.npmjs.org/ ,就是上面的 uplinks 配置
    proxy: npmjs

  '**':
    # 权限配置说明:
    # 允许所有用户(包括未经身份验证的用户)读取和发布所有包
    #
    # 你也可以指定用户名/组名配置访问权限,根据你的auth插件或者使用以下关键字配置权限:
    # "$all", "$anonymous", "$authenticated"
    access: $all

    # 发布package 的权限
    publish: $authenticated
    unpublish: $authenticated

    # 如果package 不存在,就向代理的上游服务发起请求
    proxy: npmjs

# You can specify HTTP/1.1 server keep alive timeout in seconds for incoming connections.
# A value of 0 makes the http server behave similarly to Node.js versions prior to 8.0.0, which did not have a keep-alive timeout.
# WORKAROUND: Through given configuration you can workaround following issue https://github.com/verdaccio/verdaccio/issues/301. Set to 0 in case 60 is not enough.
server:
  keepAliveTimeout: 60

middlewares:
  audit:
    enabled: true

# 监听的端口 ,重点, 不配置这个,只能本机能访问
listen: 0.0.0.0:4873
# http_proxy: http://代理服务器ip:8080
# https_proxy: http://代理服务器ip:8080
# no_proxy: localhost,127.0.0.1  #不适用代理的iP

# log settings
logs: { type: stdout, format: pretty, level: http }


常用配置详解:

  • 操作:

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

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

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

    l 或者也可以指定对应于之前我们配置的用户表 htpasswd 中的一个或多个用户,这样就明确地指定哪些用户可以执行匹配的操作

    听端口和主机名。

    localhost:4873     #默认

    0.0.0.0:4873     #表示在所有网卡监听


修改了配置文件后,运行命令

$ verdaccio -c config.yml



4.4、账号注册

账号管理在 htpasswd文件中,和config.yaml的同一个目录,注册的账号都记录在该目录下。

那么如何添加注册账号呢?有以下两种方式:


1、命令行模式添加


但是大家都可以添加,不好管理(不推荐使用)

npm adduser --registry http://npm.szy.com:4873/


2、在线生成器注册账号


因为添加账号只需要在线生成一个账号,账号管理在 htpasswd文件中和config.yaml的同一个目录下,添加账号只需要在线生成一个账号,加入到htpasswd中即可。


htpasswd在线生成器

:http://www.ab173.com/enc/htpasswd.php

加密算法选择 SHA-1 加密方式。

请添加图片描述
然后把生成结果加入到htpasswd:

请添加图片描述


发布权限

:只有登录账号的用户,才能发布。


删除权限

:目前只有特定的用户才能删除。


浏览权限

:在@szy目录下的文件必须登录才能查看,其他的无需登录。



5、组件包管理

私有服务器搭设完成之后,就可以将自己写好的组件包上传管理了。

其基本步骤包括以下三步:

1、切换源

2、登录账号(可以让服务器管理那边直接给账号)

3、将包发布到服务器上

主要命令行如下:

// 检查npm镜像
npm config get registry

如果是淘宝镜像【http://registry.npm.taobao.org】,则切换镜像
// 切换为原始镜像
npm config set registry http://registry.npmjs.org

// 初始化
npm init
// 登录
npm login
// 发布
npm publish

发布成功之后,就可以在服务器平台看到发布上去的内容:

请添加图片描述



6、访问私有服务器

那么别人的电脑怎么下载我电脑上的包呢?需要怎么配置?

你本地不需要额外配置, 先假设你们在同一局域网下,

1、你先启动服务,在 cmd 通过 ipconfig 查看局域网ip 地址

2、访问你服务的用户,安装一个npm资源管理器

// 安装
npm install -g nrm
nrm ls //展示所有的通用资源,
nrm add company http://+你的主机内网ip
nrm use company //别名
npm i package //就能下载你服务上的package,要切换回去,可以nrm use npm 或其他资源。



版权声明:本文为weixin_38633659原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。