随着前后端分离技术的发展成熟,越来越来越多的后台系统甚至前端系统采用前后端分离方式,在大型前后端分离系统中,前端往往包含大量的第三方js 包的引用,各个第三方包又可能依赖另外一个第三方包,因此急需要一个用于管理项目包之间的依赖关系的一个工具,此时npm就出现了,npm 通常随nodejs 安装的时候一起安装。

项目上经常会出现这么一种情况,就是有一些js包可能是公司内部封装的,而这些包又可能涉及到了一些私密信息,不能被上传到npm的公共仓储上去,那么此时一个好的办法就是将这些公司内部封装的js 包放到公司内部搭建的仓储上去,这样就可以保证安全性,通常我们可以通过安装 verdaccio 来搭建公司内部的npm包仓储源,在搭建完毕后,我们将我们公司内部封装的js包上创到公司内部的私有仓储源中,然后再设置npm初始化加载包时从多个仓储源查找包,从而实现npm同时从多个仓储源加载包的功能。

一、搭建本地仓储

首先输入命令:

npm install -g verdaccio --save

来安装用于搭建私有npm包仓储的工具,注意:需要先安装nodejs才能执行此命令。

安装成功后,如下图所示:

安装成功后,如果是在windows 系统上,那么可以在%APPDATA%/Roaming/verdaccio 目录下找到verdaccio的配置文件:config.yaml,同时可以在命令行窗口中

输入verdaccio 命令来启动verdaccio,启动成功后,浏览器中输入:http://127.0.0.1:4873/ 可以看到如下效果:

因为目前我们还没有上传任何私有包到上面,因此显示空列表,下面讲解如何发布私有包到verdaccio.

二、创建npm包,并上传到私有仓储

首先我们创建一个测试的npm包,然后上传到私有仓储上去。

使用 npm init 命令来创建一个包。

创建成功后,我们打开Test目录,我们可以看到生成了一个package.json的文件,打开新增publishConfig节点,表示将此包发布到http://127.0.0.1:4873这个地址:

{
"name": "@mylib/test",
"version": "1.0.0",
"description": "npm 本地包",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"测试"
],
"author": "chenxin",
"license": "ISC",
"publishConfig": {
"registry": "http://127.0.0.1:4873"
}
}

在package.json所在目录下新建index.js 文件,因为上面的main属性中指定的是index.js作为包的入口执行文件,因此名称必须命名为:index.js

因为我们在verdaccio 配置文件中指定的是发布和取消发布包需要登录,因此我们输入以下命令注册一个用户。

以上表示注册成功,并且已经登录,因为当前目录刚好处于@mylib/test包的package.json文件所在的目录,并且package.json文件中已经指定了该包要发布到的仓储地址,因此我们可以直接使用npm publish 命令发布@mylib/test包到私有仓储上去,发布成功后如下图所示:

三、设置npm 安装包时从多个仓储源查找

通过输入命令:

npm config set @mylib:registry=http://127.0.0.1:4873

以上命令告诉npm ,当遇到包名为@mylib开头的包时全部从http://127.0.0.1:4873这个地址加载。

四、测试npm是否能同时从多个仓储源加载包

输入命令:npm init 创建一个项目的package.json 文件

分别输入以下两条命令安装jquery 包 和 @mylib/test 包,其中jquery包时外部仓储源中加载的。

npm install jquery --save
npm install @mylib/test --save

此时可以看到node_modules 中已经包含上面安装的这两个包

package.json 中也包含了以上两个包的依赖

{
"name": "testproject",
"version": "1.0.0",
"description": "测试项目",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"测试"
],
"author": "chenxin",
"license": "ISC",
"dependencies": {
"@mylib/test": "^1.0.0",
"jquery": "^3.6.0"
}
}

这个时候,我们再删除:node_modules 目录,然后命令行输入(该命令要在package.json所在目录下执行):

npm init

观察node_modules 目录是否重新生成,并且包含package.json中包含的两个包,如果都包含,则表示npm 已经同时支持从多个仓储源加载包了

npm 设置同时从多个包源加载包的方法的更多相关文章

  1. Microsoft Visual Studio 2008 未能正确加载包“Visual Web Developer HTML Source Editor Package” | “Visual Studio HTM Editor Package”

    在安装Microsoft Visual Studio 2008 后,如果Visual Studio 2008的语言版本与系统不一致时,比如:在Windows 7 English System 安装Vi ...

  2. Visual Studio 2008 Package Load Failure:未能正确加载包“Microsoft.VisualStudio.Xaml”

    在安装好Visual Studio 2008后,启动Visual Studio 2008 发现如下提示: 包加载失败 未能正确加载包“Microsoft.VisualStudio.Xaml”( GUI ...

  3. 未能加载包“Microsoft SQL Server Data Tools”

    直接在vs2013里的App_Data目录创建数据库,在服务器资源管理器中查看时报错: 未能加载包“Microsoft SQL Server Data Tools” 英文: The 'Microsof ...

  4. 使用NuGet加载包,发现加载的dll都是最新版,原来少加了参数[-Version]

    使用NuGet获取AutoMapper 发现无法正确加载包,项目版本是3.5,获取的dll版本较高,查资料发现可以通过 “-Version” 指定加载包版本 http://www.mamicode.c ...

  5. 开启Microsoft SQL Management时,如果出现"未能加载包

    Ms Sql server 2005在开启Microsoft SQL Management时,如果出现"未能加载包“Microsoft SQL Management Studio Packa ...

  6. 包加载失败 未能正确加载包“xxx”...

    打开vs2008或者2005如果弹出一个警告对话框 包加载失败 未能正确加载包“xxx” ...... 的字样,就可以用以下方法解决. 在cmd下运行带参数的devenv.exe: "d(盘 ...

  7. VS未能正确加载包

    这个方法同样适用于多个版本的VS 首先关闭VS进这里:C:\Users\用户名\AppData\Roaming\Microsoft\VisualStudio\11.0(2012是11.0,根据你的VS ...

  8. visual studio2017 无法添加引用 未能加载包ReferenceManagerPackage not such interface support 解决方法

    安装完visual studio 2017 后添加引用总是提示 未能加载包ReferenceManagerPackage, 这个问题困扰了两天,直到在网上看到了下面这一段 I just got thi ...

  9. R-安装、卸载、查看及卸除加载包

    1. 安装包 install.packages("BiocInstaller") 2. 卸载已安装包 remove.packages("BiocInstaller&quo ...

随机推荐

  1. java中 字符串的构造方法和直接创建

    java.long.String类代表字符串.Java 程序中的所有字符串字面值(如 "abc" )都作为此类的实例实现.(程序当中所有的双引号字符串,都是String类的对象[没 ...

  2. azure获取vm运行状态

    az vm list -d -o json --query "[?name=='vm-name']" | jq '.[0].powerState' 输出vm信息 az vm lis ...

  3. 字节跳动Android面试凉凉,挥泪整理面筋,你不看看吗?

    想在金九银十找工作的现在可以开始准备了,这边给大家分享一下面试会遇到的问题. 找工作还是需要大家不要担心,由于我们干这一行的接触人本来就不多,难免看到面试官会紧张,主要是因为怕面试官问的答不上来,答不 ...

  4. 爱了,字节跳动大神最佳整理:582页Android NDK七大模块学习宝典,理论与实践

    前言 时至今日,短视频App可谓是如日中天,一片兴兴向荣.随着短视频的兴起,音视频开发也越来越受到重视,而且薪资水涨船高,以一线城市为例,音视频工程开发的薪资比Android应用层开发高出40%. 但 ...

  5. JVM G1GC的算法与实现

    G1GC 是什么? 一些基本概念 实时性 G1GC 有什么特点? G1GC 的堆结构是什么样的? G1GC 的执行过程是什么样的? 并发标记 并发标记是什么 标记位图 执行步骤 步骤 1--初始标记阶 ...

  6. 寻找写代码感觉(一)之使用 Spring Boot 快速搭建项目

    写在前面 现在已经是八月份了,我已经荒废了半年居多,不得不说谈恋爱确实是个麻烦的事,谈好了皆大欢喜,分手了就是萎靡不振,需要很长一段时间才能缓过来. 人还是要有梦想的,至于实现只不过是一个契机,但凡不 ...

  7. 在Django中使用Channels功能

    前言:最近后台写游戏更新版本功能,简单就是前端发送更新请求,后端需要对很多台服务器进行更新和各种操作,本来想着实现不难,后来发现因为后端需要执行很长时间,前端返回报错,后端会执行完毕,但是前端先断开了 ...

  8. Pikachu-File Inclusion模块

    一.概述 文件包含,是一个功能.在各种开发语言中都提供了内置的文件包含函数,其可以使开发人员在一个代码文件中直接包含(引入)另外一个代码文件. 比如 在PHP中,提供了:include(),inclu ...

  9. 09.SpringMVC之类型转换

    一. 类型转换器 前端传入的值,从表单中传入的值,都是字符串或者是字符串数组的形式传入的,在后端需要进行手动的转换类型,然后才能正确的使用. 框架一般对常见的数据类型的转换进行了封装提供,如字符串转换 ...

  10. SpringCloud商品服务调用方式之feign

    简介:改造电商项目 order-service服务 调用商品服务获取商品信息 Feign: 伪RPC客户端(本质还是用http) 官方文档: https://cloud.spring.io/sprin ...