无星的前端之旅（三十四）——verdaccio解决内网依赖.md

背景

前面使用playwright时，就谈过这个内网依赖的问题，今天我将使用究极模式来解决这个问题

环境

一台内网机，一台外网机

内网机有node和npm

1.自建私服

使用verdaccio，这个大家应该都不陌生

接下来，我会告诉你如何搭建一个私服，并让它可用

因为考虑到我们是需要迁移到内网，所以我们拒绝全局安装

这里我们不考虑什么打包tgz的方式

那太麻烦了， 还要分析依赖，还要分析依赖的依赖等

2.下载verdaccio

在外网机，新建一个文件夹，比如就叫verdaccio

执行如下命令

npm init -y
npm install verdaccio

3.配置verdaccio的config.yaml

进行如下配置

路径配置为当前这个文件夹下哈

# 数据存储目录（修改为您的路径）
storage: E:\\verdaccio\\packges

# 插件目录（修改为您的路径）
plugins: E:\\verdaccio\\plugins

# 其他配置保持默认或按需调整（如权限、上游镜像等）
web:
  title: 内网NPM仓库
auth:
  htpasswd:
    file: ./htpasswd

cache: true  # 启用完整包缓存（默认值）
uplinks:
  npmjs:
    url: https://registry.npmjs.org/
    cache: true  # 启用上游缓存

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: "$all", "$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


server:
  keepAliveTimeout: 60

middlewares:
  audit:
    enabled: true

# https://verdaccio.org/docs/logger
# log settings
log: { type: stdout, format: pretty, level: http }

这样就配置好了

4.启动verdaccio

npx verdaccio --config .\config.yaml

启动以后看下端口号,例如4873，访问http://localhost:4873/

5.添加一个用户

npm adduser --registry http://localhost:4873/

有了账号密码，就可以使用了

7.再新建一个项目，把所有你在内网需要使用的包都装上

建个项目，娶个名字，比如demo

npm init -y

8.配置.npmrc

在demo项目下，新建一个.npmrc文件，内容如下

注意,//不是注释,#才是注释

假如上述注册的账号密码为admin和password,那么内容如下

拼接为用户名:密码,然后进行Base64编码

registry=http://localhost:4873/
//localhost:4873/:_auth="YWRtaW46cGFzc3dvcmQ="       # "admin:password"的Base64编码
always-auth=true  

9.安装内网所需依赖

全下下来

npm install xxxx

在verdaccio项目的packages文件夹下，你就可以看到所有刚刚下载的包了

10.把verdaccio整个文件夹，拷贝到内网机上

11.在内网机的项目上配置.npmrc文件

npm install

完事