使用verdaccio搭建npm私有库

为什么要搭建npm私有仓库? 什么情况下需要私有仓库?

还记得很早之前有一次面试, 我提到了对于组件的封装, 面试官问我: 那如果几个项目都需要用到你封装好的组件, 你们怎么处理? 我当时说我们就几个项目之间进行复制粘贴, 接着他问我思考过更好的方式没有, 显然他是希望我提出npm私有库去处理这个问题, 当时我并不知道.

其实在日常的开发中, 我们非常需要一个npm私有仓库存放相关公用的组件及模块, npm私有仓库我们可以理解为公司内部的类似 http://npmjs.org 这样子管理包的平台, 在公司内部搭建一个npm仓库，管理包的同时，也可以借助npm的命令行工具快速用代码模块或业务组件.

怎么搭建, 我们需要准备什么?

既然是一个包管理平台, 在这里我使用verdaccio进行搭建https://github.com/verdaccio/verdaccio, 其次我们首先需要创建npm包, 再将包发布到自己的服务器上,
1. verdaccio环境搭建
1) 安装node环境(参考node官网https://nodejs.org/en/)
2) 安装verdaccio

npm install -g verdaccio

如果在安装过程中报 grywarn的权限错的话，那么需要加上 --unsafe-perm, 如下命令：

npm install -g verdaccio --unsafe-perm

3) 启动 verdaccio
安装完成后，我们就可以在命令行中,输入verdaccio命令运行，如下所示：

然后在浏览器中运行http://localhost:4873, 我们可以看到:

4) 配置verdaccio
执行如下指令, 查看npm包的全局安装位置

npm root -g

可以看到我的npm存放地址:
/Users/huangjing/.nvm/versions/node/v8.8.1/lib/node_modules
这时候我们执行如下命令找到默认的配置 default.yaml:

cd /Users/huangjing/.nvm/versions/node/v8.8.1/lib/node_modules
cd verdaccio
cd conf

需要修改config.yaml文件(config.yaml在哪里??)

cd /Users/huangjing/.config/verdaccio

sudo open ./config.yaml , 打开文件后添加最后一句话listen: 0.0.0.0:4873

This is the default config file. It allows all users to do anything,
# so don't use it on production systems.
#
# Look here for more config file examples:
# https://github.com/verdaccio/verdaccio/tree/master/conf
#

# path to a directory with all packages
storage: ./storage
# path to a directory with plugins to include
plugins: ./plugins

web:
  title: Verdaccio
  # comment out to disable gravatar support
  # gravatar: false
  # by default packages are ordercer ascendant (asc|desc)
  # sort_packages: asc

auth:
  htpasswd:
    file: ./htpasswd
    # Maximum amount of users allowed to register, defaults to "+inf".
    # You can set this to -1 to disable registration.
    # max_users: 1000

# a list of other known repositories we can talk to
uplinks:
  npmjs:
    url: https://registry.npmjs.org/

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

# 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

# log settings
logs:
  - { type: stdout, format: pretty, level: http }
  #- {type: file, path: verdaccio.log, level: info}
#experiments:
#  # support for npm token command
#  token: false

# 如下是新增的，默认是没有的，只能在本机访问，添加完成后就可以在外网访问了~  
listen: 0.0.0.0:4873

verdaccio初步配置完成啦~

---

直接在终端通过verdaccio命令启动服务时，通常会借助pm2工具进行进程管理
安装pm2

npm install -g pm2

使用pm2启动verdaccio, 启动成功后也可以访问http://localhost:4873

pm2 start which verdaccio

2. npm包
安装私有库的地址当然要换成自己服务器的地址, 在这里我们使用nrm去管理npm的源
安装nrm
npm install -g nrm
nrm add test http://localhost:4873

并且切换到当前test源

这时候我们就需要准备自己的npm包, 私有npm仓库中发布包需要注册或登录账号, 如果我们还没有账号的话，通过输入命令npm adduser, 然后依次输入用户名密码即可创建完毕。如果已有账号，通过输入命令 npm login，然后依次输入用户名密码即可登录(注意发布前一定要将nrm切换到npm的源)

# 注册用户npm adduser 在本地注册一个用户然后指向我们的地址然后我们就可以发布包了

npm adduser --register http://localhost:4873/(nrm指向自己创建的本地源)
或者 npm login

可以使用npm whoami查看当前登录用户

---

制作一个npm包

1. 新建一个文件夹取名 npmdemo
2. npm init新建一个package.json
3. 新建index.js

{
  "name": "npmdemo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

module.exports = function() {
  console.log('这是一条来自私有库的console!!!')
};

发布我们只做好的包, 进到项目的根目录,执行npm publish --registry http://localhost:4873
我发布的时候报了个错,

npm ERR! code E401
npm ERR! Unable to authenticate, your authentication token seems to be invalid.
npm ERR! To correct this please trying logging in again with:
npm ERR!     npm login

可能是因为我以前的账号有问题, 我重新执行npm adduser --registry http://localhost:4873, 创建一个新的本地账号
再发布成功后, 刷新页面

---

终于可以用自己生产的npm包了!

1. 新建一个npmdemo2文件夹
2. 安装testdemo包, 执行npm install npmdemo, 可以看到package.json中添加了一个npmdemo的包, 并且版本号就是我们发布的版本

{
  "name": "npmdemo2",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "dependencies": {
    "npmdemo": "^1.0.7",
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

3. 连接到自己的服务器(下次继续...)