前端进阶指南

Appearance

使用 Docker+verdaccio 搭建 npm 私有源 ​

1.基本的安装 ​

1.在服务器创建/home/npm_store 的目录

2.在/home/npm_store目录下创建docker-compose.yaml文件，写入下面的内容

yaml
version: "3.4"

services:
  verdaccio:
    image: verdaccio/verdaccio
    container_name: "verdaccio"
    environment:
      - VERDACCIO_PORT=4873
    ports:
      # 对外映射对口:容器内的端口
      - "9601:4873"
    volumes:
      - "./storage:/verdaccio/storage"
      - "./config:/verdaccio/conf"
      - "./plugins:/verdaccio/plugins"
# 上面配置即使用了刚才下载的 verdaccio 镜像，容器和宿主机都绑定在 4873 端口。同时挂载了当前目录的 storage，config， plugins 文件夹到容器内部。

3.由于启动时容器会去找 /home/npm_store/config/config.yaml 文件，所以在 config 文件夹新建该文件，填入以下内容：

4.执行此命令启动容器：docker-compose up -d --build

yaml
# 所有包的保存路径
# 此处的路径相对于配置文件即可，不要使用绝对路径
storage: ../storage
# 插件的保存路径
plugins: ../plugins
# 账号密码文件，初始不存在
web:
  enable: true
  title: 私有 NPM 仓库123
  gravatar: true
  login: true
  pkgManagers:
    - npm
    - yarn
    - pnpm
  html_cache: true
  showFooter: false

auth:
  htpasswd:
    # 在config目录下创建htpasswd文件，与config.yaml同级，用相对路径即可
    file: ./htpasswd
    # max_users：1000
    # 默认1000，允许用户注册数量。
    # 为-1时，不能通过 npm adduser 注册，此时可以直接修改 file 文件添加用户。

i18n:
  web: zh-CN

# 包发布成功的时候调用接口发送数据通知
notify:
  method: POST
  headers: [{ "Content-Type": "application/json" }]
  endpoint: http://59.36.169.39:9701/
  content: '{"msgtype":"text", "at": {"atMobiles": ["13000000000"] }, "text":{"content":"NPM 发布新包：\n > 包名称：{{name}} \n > 版本号：{{#each versions}}{{version}}{{/each}} \n > 发布者：{{publisher.name}} "}}'

  # 本地不存在时，读取仓库的地址
uplinks:
  npmjs:
    url: https://registry.npmjs.org/
  yarn:
    url: https://registry.yarnpkg.com/
    timeout: 10s
  taobao:
    url: https://npmmirror.com/
    timeout: 10s

# 对包的访问操作权限，可以匹配某个具体项目，也可以通配
# access 访问下载；publish 发布；unpublish 取消发布；
# proxy 对应着uplinks名称，本地不存在，去unplinks里取
# $all 表示所有人都可以执行该操作
# $authenticated 已注册账户可操作
# $anonymous 匿名用户可操作
# 还可以明确指定 htpasswd 用户表中的用户，可以配置一个或多个。
packages:
  "@*/*":
    access: $all
    publish: $authenticated
    proxy: npmjs yarn taobao
  "**":
    access: $all
    publish: $authenticated
    unpublish: $authenticated
    proxy: npmjs yarn taobao

middlewares:
  audit:
    enabled: true

logs: { type: stdout, format: pretty, level: http }

5.注册用户并发布包。

shell
# 注册用户在指定的npm源上面
npm adduser --registry http://59.36.169.39:9601

6.verdaccio 升级迁移

将原服务器上的 config.yaml、htpasswd 和 storage 文件夹迁移到新的文件夹对应的目录即可，然后修改一下权限。参考上面 verdaccio 的安装配置。

shell
scp config.yaml user@remoteServer:/path/to/config.yaml
scp htpasswd user@remoteServer:/path/to/htpasswd
scp -r storage user@remoteServer:/path/to/storage

2.常见的问题(必看) ​

2.1 无法发布 ​

错误信息： 'xxx' is not in this registry, You should bug the author to publish it (or use the name yourself!)

解决办法： 给 storage 文件夹调整读写权限

shell
# 请在和storage同级的地方执行下面的命令
chmod -R 777 storage
# 或者
sudo chown -R 10001:65533 storage

2.1 无法注册用户 ​

错误信息：permission denied, open '/verdaccio/conf/htpasswd'

原因与解决办法：用户在新增 npm 用户的时候会写入 htpasswd 文件，由于该文件是在宿主机中，默认是 root 用户建立的，而 verdaccio 容器中拥有自己的用户名，名字就叫 verdaccio，所以无法写入 root 用户拥有的文件。 那么是不是还要在宿主机上新建 verdaccio 用户呢？不用这么麻烦。根据官方文档和文末的最后一篇文章得知，docker 容器中的 uid 和 gid 和宿主机是共享的，只不过没有具体的名称，而容器内 verdaccio 使用的 uid 为 10001，gid 为 65533，所以我们在宿主机改一下 htpasswd 文件的权限：

shell
# 没有htpasswd文件需要先创建再赋予权限
touch htpasswd
sudo chown 10001:65533 htpasswd

3.npm 包管理 ​

3.1.npm 的使用 ​

shell
# 查看npm的镜像源
npm config get registry
# 查看 npm 的所有配置
npm config list
# npm 切换镜像
npm config set registry <镜像源 URL 地址>
# 查看一个包的所有版本
npm view <包名> versions

3.2.nrm 的使用 ​

shell
# 使用nrm管理镜像源
# 安装nrm
npm i nrm -g
# nrm查看当前所有的镜像源
nrm ls
# nrm 切换镜像源
nrm use taobao(此为镜像源的名称)
# nrm 新增一个自定义的镜像源
nrm add cgnpm http://59.36.169.39:9601/
# nrm 删除一个镜像源
nrm del cgnpm
# nrm 测试一个镜像源的速度
nrm test cgnpm

3.3 npm 发布忽略项目文件 ​

shell
# .npmignore
# .npmignore，不建议配置到package.json里面
.*.swp
._*
.DS_Store
.git
.hg
.npmrc
.lock-wscript
.svn
.wafpickle-*
config.gypi
CVS
npm-debug.log
node_modules/

# 下面的文件 默认被包含，即便设置忽略也无效
package.json
README (and its variants)
CHANGELOG (and its variants)
LICENSE / LICENCE