探索 npm:JavaScript 的赛博配给站

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

简介

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

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命令行工具来安装、更新、删除包了。
image.png

查看版本

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世界无限可能的人。


相关文章
|
数据采集 移动开发 边缘计算
2021 年最受欢迎 JavaScript 明星项目榜:zx、Vite 、Next.js 、React 领衔大热门(2)
2021 年最受欢迎 JavaScript 明星项目榜:zx、Vite 、Next.js 、React 领衔大热门
478 0
2021 年最受欢迎 JavaScript 明星项目榜:zx、Vite 、Next.js 、React 领衔大热门(2)
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的重庆理工大学心理咨询管理子系统附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的重庆理工大学心理咨询管理子系统附带文章和源代码部署视频讲解等
19 1
|
6月前
|
Java 测试技术 数据安全/隐私保护
基于ssm+vue.js+uniapp小程序的“爱相连”儿童慈善管理系统附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的“爱相连”儿童慈善管理系统附带文章和源代码部署视频讲解等
24 0
基于ssm+vue.js+uniapp小程序的“爱相连”儿童慈善管理系统附带文章和源代码部署视频讲解等
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的广西文化传承小程序附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的广西文化传承小程序附带文章和源代码部署视频讲解等
32 0
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的甘肃“印象”网站附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的甘肃“印象”网站附带文章和源代码部署视频讲解等
23 0
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的必录德健身器材用品网附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的必录德健身器材用品网附带文章和源代码部署视频讲解等
51 0
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的“步步顺”鞋材零售网店附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的“步步顺”鞋材零售网店附带文章和源代码部署视频讲解等
22 0
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的北工国际健身俱乐部附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的北工国际健身俱乐部附带文章和源代码部署视频讲解等
22 0
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的国学文化网站附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的国学文化网站附带文章和源代码部署视频讲解等
23 0
|
6月前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的贫困地区儿童资助系统附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的贫困地区儿童资助系统附带文章和源代码部署视频讲解等
36 0