JavaScript

npm包管理和配置npm的nexus私服

2019-05-28  本文已影响0人  葵葵的花园

一、为什么要用包管理工具？

  1. 每种语言扩展的包很多，如js有jquery React Vue等。这就是直接使用别人已经写好的。
    传统做法是：去官网下载对应的js包，然后放进项目的路径下。然后在使用的文件里引用。
    有了npm和yarn等包管理工具后的做法：包管理工具都有一个集中仓库，所有开放的包都放在这个仓库里，方便了查找和下载。
    即开放的包都放在了npm搭建的服务器里，我们需要时，可以使用npm提供的命令去他的服务器上查找相应的版本进行下载。
  2. 管理包之间的依赖关系：
    如：我的一个项目里，使用了一个包A，然后这个包A又依赖于包B，包B又依赖于包C，D等。而且每个包都有确定的版本（不一定是最新的，版本相差太大，会出现API不兼容的情况）。

A -》B -》C,D

在没有包管理之前：人工去下载每一个依赖的包或者使用语言把每个包常用的功能自己实现一遍。

二、为什么要搭建npm私有仓库（私服）？

例：

  1. 我有三个vue项目A、B 、C。
  2. 我在A项目写了一个table组件，又不能将这个组件发布到npm公共社区里。

没有npm私服时的做法：

  1. 这时如果B和C项目要用带这个组件的话，只能去A项目里复制一份粘贴到B和C项目。
  2. 如果后面table组件更新了的话，又只能复制粘贴。

如上这种情况，耗费时间。有时还会忘了哪个项目的组件时最新的。一个组件都这么麻烦，如果是多个组件和多个项目，维护简直要疯了。

如果我们有npm私有仓库的做法：

  1. 将table组件发布到私有仓库里
  2. 每个项目启动前，执行npm 命令重新下载更新组件即可。

私有npm私有仓库的好处

三、npm安装流程

*没有私服：

  1. 当我们使用npm install去安装一个模块时，会先检查node_modules目录中是否已经存在这个模块。
  2. 如果没有则会向远程仓库查询，下载并解压到本地进行安装。

有私服：

  1. 用户install后向私有npm服务器发起请求，私有服务器会先查询所请求的这个模块是我们自己的私有模块或已经缓存过的公共模块。
  2. 如果是则直接将模块返回给用户。
  3. 如果请求的是一个还没有被缓存的公共模块，那么则会向上游源请求模块并进行缓存后返回给用户。
  4. 上游的源可以是npm仓库地址，也可以是淘宝镜像地址。

四、npm的命令和知识点

1.通用查看

1.1 npm root -g
查看通过-g选项全局安装的模块的地址。

image.png
1.2 npm whoami
查看当前登录npm的账户。publish发布包时可以查看用户是否正确。
image.png
1.3 npm login ：登录
1.4 npm adduser ：添加新用户

2. npm配置文件

image.png
2.1 npm config list -l
列出npm的左右默认配置项。
2.2 npm config get cache
获取npm的缓存目录。config里的所有配置项都可以通过get获取。
2.3 npm config get registry
获取node包存放的服务器地址。
n

3. npm获取配置的优先级

下面优先级由高到低：
3.1 命令行参数
3.2 环境变量
3.3 用户配置文件（.npmrc）：npm config get userconfig用于查看所在地址，通常在电脑用户文件夹下。

文件
3.4 全局配置文件：通过npm config get globalconfig查看文件地址。
image.png
3.5 内置配置文件：npm安装目录下的npmrc文件。
我的：D:\SOFTWARE\Node\node_modules\npm
3.6 默认配置：npm本身都有默认的配置参数，如果以上都没有设置，则npm会使用默认的配置参数。

注：在使用命令进行属性配置时，属性默认是被存储与用户的配置文件（.npmrc）中的，命名后加上--global则会被存储在全局配置文件中。

4.配置npm的注册源方式

4.1 通过给npm命令添加注册源选项：这种方式指定的注册源只在本条命令内有效。

image.png
4.2 通过npm的config命令配置指向国内镜像源：以后所有从仓库获取的包都从这个地址获取，不走国外的地址。
image.png
注：这条命令时将配置信息更新到电脑用户下的.npmrc文件。我的这个文件地址：C:\Users\Thinkpad\.npmrc
4.3 直接修改C:\Users\Thinkpad\.npmrc文件，打开后修改： 
// .npmrc
registry=https://registry.npm.taobao.org

以上都是为下面配置npm私服做准备的，毕竟需要知道为什么这么做。

五、windows10配置npm的nexus私服

1.下载软件

点此处去官网下载
下载有点慢，请耐心等待。

image.png

2.解压压缩包，进入如下图的地址（版本号在截图里有）：

image.png
2.1 不要直接点击nexus.exe，在该目录下使用命令行运行：nexux.exe /run
2.2 启动后默认的地址是：http://localhost:8081。建议第一次自己配置时，不要修改配置文件的地址和端口。但如果端口被占用，那么只有修改了。修改过后可能会出现一些问题。默认账号：admin/admin123
2.3 打开下图目录下的nexus-default.properties文件可以修改端口和地址，别的选项不知道什么意思就别动。
image.png
image.png
2.4 如果在启动时报如下的错：
image.png
那么就是nexus.exe的解压路径有中文，把中文改了就可以了。

3.建立仓库

打开http://localhost:8081，后登录账号。

3.1 创建知识库，有三种类型。

image.png
image.png

3.2 创建npm(hosted)私有仓库

image.png

3.3 创建npm(proxy)代理仓库

image.png

3.4 创建npm(group)仓库组

image.png

3.5 查看新建的三个仓库

image.png

点进仓库，可以看到这个仓库的地址。
我的三个仓库的地址分别是(链接是点不动的)：

3.6 配置权限

image.png

4. 配置npm

直接执行命令：
npm config set registry http://localhost:8081/repository/npm-test-group/
具体的意思参考本文的第四部分：npm的命令和知识点。

5.新建一个npm包，发布到建立的私服

建立如下图所示的yx-test-local包

image.png

5.1 package.json文件使用npm init -y生成。

5.2 新建index.js文件，内容如下。

// index.js
module.exports = 123456789;

5.3 进入yx-test-local包根目录，发布包。

直接执行如下图命名发布包时报错：当时一直以为是权限的问题，但使用电脑Administator账户也同样报错。应该是步骤和添加用户时的仓库地址的问题。

image.png
5.3.1 先登录hosted仓库
image.png
注意：当npm adduser和npm login时，操作的仓库一定是hosted，是私有的。不能是group。因为我们的包是要发布到hosted的
5.3.2 执行上传
image.png
5.3.3 查看上传的包
image.png
上面除了上传到私有仓库的yx-test-local包以外，别的包都是进行测试下载的包被缓存到了私服里。

6.下载私有包和开放的包

6.1 新建npm文件夹，进入文件夹

image.png

6.2 下载私有包

image.png

上图红框的请求地址就是我们刚新建的仓库组的地址。

6.3 下载开发的包

image.png

从代理仓库配置的地址进行下载后缓存。

6.4 查看下载的包

image.png
上一篇 下一篇

猜你喜欢

热点阅读