首页 前端知识 npm 包管理工具

npm 包管理工具

2024-06-07 00:06:33 前端知识 前端哥 781 133 我要收藏

简介

Node官网:https://nodejs.org/
Npm官网:https://www.npmjs.com/

在现代的软件开发世界中,包管理工具起着至关重要的作用。它们为开发者社区提供了一种高效共享和使用代码的方式。在 JavaScript 的范畴内,npm(Node Package Manager)伫立在这一领域的前沿,成为了开发者在进行Web开发时不可或缺的工具之一。

npm 的诞生和崛起

npm是为Node.js设计的包管理器,由Isaac Z. Schlueter于2010年创立,它允许用户从npm仓库安装、分享、分发代码,并管理项目依赖性。如今,它已经成为世界上最大的软件注册表,拥有超过百万个包,为全球JavaScript程序员提供服务。

什么是包管理工具?

在深入探索npm之前,有必要理解“包管理工具”的概念。简单地说,包管理工具是一个允许开发者创建、分享、使用软件包的平台。软件包是一个包含代码、资源和元数据的文件集合,它们提供一种固化和封装功能、库和框架的方式。
还有哪些包管理工具?
yarnbower

npm 的核心特性

1. 依赖管理

npm让管理项目的依赖成为一个轻而易举的事。通过编辑package.json文件,开发者可以精确地指定依赖版本,npm会自动处理安装和更新。

2. 脚本运行

除了管理依赖,npm还允许开发者在package.json中定义脚本,这可以简化许多常见的开发任务,如启动应用、运行测试或者编译源代码。

3. 社区支持

npm的一个重要特性是其广泛的社区支持。无论你需要什么,你总能在npm中找到别人已经构建好的解决方案。

npm 和 Node.js

使用npm的主要场景之一是与Node.js结合。Node.js允许JavaScript运行在服务器端,而npm则为它提供了必要的第三方包支持,使得开发现代Web应用成为可能。

如何使用 npm?

安装和配置

安装Node.js会自动安装npm。一旦安装完成,你就可以使用npm命令行工具来安装、更新、删除包了。
https://nodejs.org/en/download
在这里插入图片描述

查看版本

node -v
npm -v

常用命令

查看npm的配置列表

npm config list

获取某一项配置

#获取包全局安装路径的前缀(-g全局安装在此目录,未指定全局安装在当前目录)
npm config get prefix
#获取包安装时缓存的路径
npm config get cache
#获取npm仓库地址
npm config get registry

配置使用国内仓库地址

第一种方法:使用cnpm代替npm

#安装cnpm后,用到npm的地方直接用cnpm代替即可
npm install cnpm -g --registry=https://registry.npm.taobao.org
#验证一下
cnpm config get registry

第二种方法:修改npm的仓库地址

#会生成npm的配置文件(C:\Users\ZZZYY\目录下的.npmrc),可查看验证
npm config set registry https://registry.npm.taobao.org
#验证一下
npm config get registry

注意:rc后缀的文件多是配置文件,可以看做run command的缩写。

如何修改全局安装路径?

第一步:在.npmrci配置文件中新增如下内容:

prefix=E:\npm\repo_node\npm
cache=E:\npm\repo_node\npm_cache

第二步: 修改环境变量path增加:

E:\npm\repo_node\npm

初始化新项目

通过运行npm init,你可以为你的项目创建一个package.json文件,这是管理项目依赖的起点。

安装包

要为项目添加一个新包,可以使用npm install <package-name>命令。这不仅会下载包,还会将其添加到你的package.json文件中。

保存了项目依赖的各种包,从git clone下来项目之后,直接使用npm install即可安装所有依赖,不需要把真正的依赖上传。

npm 的未来

npm持续在演进。最新版本带来了更快的性能,更好的安全性和更简洁的用户体验。随着JavaScript生态的不断发展,npm也在不断地扩展其功能以满足日益增长的需求。

npm常用命令

https://www.npmjs.com/

#按package.json中的配置来安装
npm i
#查看当前目录下已安装的第三方包,加-g查看全局的
npm list
#查看某个包在仓库有哪些可用版本
npm view jquery versions
#安装jquery的最新版本,全局安装加-g
npm i jquery
#安装指定版本
npm i jquery@1.11.1

package.json中^~的区别:

  • ^1.11.1:选取范围<2.0.0且>=1.11.1
  • ~1.11.1:安装最新的小版本,1.11.x,选取最大的

package-lock.json

  • 锁定了具体的版本,避免语义版本带来项目bug。
  • 通过命令行操作软件包时此文件会根据package.json的内容自动被npm修改,不要自己修改这个文件。

当package-lock.json和package.json一致时,npm i根据package-lock.json来,否则根据package.json来并同步更新到package-lock.json中

#保存到开发依赖节点(添加--save-dev/-D选项),默认保存到运行时依赖(即默认加了--save/-S)
npm install webpack webpack-cli -D
#清理npm安装的缓存,实际上清理的是你配置的缓存目录(E:\npm\ repo_node\npm_cache)
npm cache clean --force
#删除某个包,删除全局的-g
npm uninstall jquery
#更新某个包到最新版本
npm update jquery
#运行脚本,xXX是你在package.json的scripts标签里面定义的命令,名字随便。
npm run xxx

注意:xxx对应的命令会优先使用局部安装的包,如:

npm install webpack webpack-cli -g
npm install webpack@3.6.0 -D

此时通过webpack-v查看到的是全局的webpack的版本,如何查看本项目依赖的webpack版本呢?

怎么使用

在没结合webpack之前,跟原来一样,从node_modules目录下找即可

结语

npm是每一位JavaScript开发者技能树上的基础。它简化了复杂的依赖管理问题,使得共享以及使用开源代码变得前所未有地容易。正是有了npm这样的工具,我们才能站在巨人的肩膀上进行更为创新和高效的软件开发。

无论你是一个初学者,还是一个经验丰富的工程师,投入时间去深入理解npm都是一项值得的投资。对于未来,npm将继续赋能给那些愿意探索JavaScript世界无限可能的人。


转载请注明出处或者链接地址:https://www.qianduange.cn//article/11192.html
标签
评论
发布的文章

1.10 Unity中的数据存储 JSON

2024-06-13 21:06:30

JSON 数据格式化方法

2024-06-13 21:06:26

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!