npm的包管理核心学习

什么是NPM

NPM 全称 Node Package Manager,它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具。通过
NPM 可以安装、共享、分发代码,管理项目依赖关系。
可从NPM服务器下载别人编写的第三方包到本地使用。
可从NPM服务器下载并安装别人编写的命令行程序到本地使用。
可将自己编写的包或命令行程序上传到NPM服务器供别人使用。
其实我们可以把 NPM 理解为前端的 Maven。我们通过 npm 可以很方便地安装与下载 js 库,管理前端工程。
最新版本的 Node.js 已经集成了 npm 工具,所以必须首先在本机安装 Node 环境
Node.js 官网下载地址:
英文网:https://nodejs.org/en/download/
中文网:http://nodejs.cn/download/
装完成后,查看当前 nodejs 与 npm 版本
在这里插入图片描述

NPM初始化项目

在桌面建立一个文件夹npm_demo
进入npm_demo的文件夹
在这里插入图片描述
根据提示输入相关信息,如果使用默认值,则直接回车即可。
package name: 包名,其实就是项目名称,注意不能有大写字母
version: 项目版本号
description: 项目描述
keywords: {Array}关键字,便于用户搜索到我们的项目

在这里插入图片描述
最后会生成 package.json 文件,这个是包的配置文件,相当于 maven 的 pom.xml 我们之后也可以根据需要进行修改
在这里插入图片描述
在这里插入图片描述
初始化项目,均采用默认信息,不会提示你手动输入信息

 npm init -y

安装方式

npm install 命令用于安装某个模块,安装方式分为 :本地安装(local)、全局安装(global)两种.
本地安装
将 JS 库安装在当前执行命令时所在目录下

# 本地安装命令, 版本号可选
npm install <Module Name>[@版本号]

全局安装
将 JS 库安装到你的 全局目录 下

# 全局安装命令
npm install <Module Name>[@版本号] -g

如果安装时出现如下错误:
npm err! Error: connect ECONNREFUSED 127.0.0.1:8087
解决方法,执行如下命令:

npm config set proxy null

本地安装会将 js 库安装在当前目录下
安装最新版 express 模块,它是基于Node.js 平台的 Web 开发框架,执行如下命令

npm install express

运行模式如下
在这里插入图片描述
在这里插入图片描述
如果出现黄色的是警告信息,可以忽略,请放心,你已经成功安装了。
在该目录下会出现一个 node_modules 文件夹 和 package-lock.json
node_modules 文件夹用于存放下载的js库(相当于maven的本地仓库)
package-lock.json 是在 npm install 时候生成一份文件。
用以记录当前状态下实际安装的各个包的具体来源和版本号。
重新打开 package.json 文件,发现刚才下载的 jquery.js 已经添加到依赖列表中了
在这里插入图片描述
指定版本安装
关于模块版本号表示方式:
指定版本号:比如 3.5.2 ,只安装指定版本。遵循 “大版本.次要版本.小版本”的格式规定。
~ 波浪号 + 指定版本号:比如 ~3.5.2 ,安装 3.5.x 的最新版本(不低于 3.5.2),但是不安装 3.6.x,也
就是说安装时不改变大版本号和次要版本号。
^ 插入号 + 指定版本号:比如 ^3.5.2 ,安装 3.x.x 的最新版本(不低于 3.5.2),但是不安装 4.x.x,也
就是说安装时不改变大版本号。需要注意的是,如果大版本号为0,则插入号的行为与波浪号相同,这是
因为此时处于开发阶段,即使是次要版本号变动,也可能带来 程序的不兼容。
latest :安装最新版本。
安装jQuery指定版本

npm install jquery@2.2.0

打开文件夹可以看到下面内容
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

全局安装

使用全局安装会将库安装到你的全局目录下。
查看全局安装目录
如果你不知道你的全局目录在哪里,执行命令:

npm root -g

在这里插入图片描述
修改默认全局安装目录,使用命令 :
比如我修改为 D:\npm

 npm config set prefix "D:\npm"

安装Vue

 npm install vue -g

查看全局目录

npm list -g

在这里插入图片描述
在这里插入图片描述

生产环境模块安装

–save 或 -S 参数意思是把模块的版本信息保存 package.json 文件的 dependencies 字段中(生产环境依赖)

npm install <Module Name> [--save|-S]

如果不加 [–save|-S],就默认生产环境安装
在这里插入图片描述
在本地安装Vue的生产环境

npm install  vue -s

在这里插入图片描述
在 package.json 文件的 dependencies 字段中
在这里插入图片描述

开发环境模块安装

格式:
–save-dev 或 -D 参数是把模块版本信息保存到 package.json 文件的 devDependencies 字段中(开发环境
依赖),所以开发阶段一般使用它:

npm install <Module Name> [--save-dev|-D]

举例:
安装 eslint 模块,它是语法格式校验,只在开发环境依赖中即可

npm install eslint -D

在这里插入图片描述
在 package.json 文件的 devDependencies 字段中
注意:devDependencies 中的依赖是开发环境依赖, dependencies中的是生产环境依赖
在这里插入图片描述

批量下载模块

我们从网上下载某些项目后,发现只有 package.json , 没有 node_modules 文件夹,这时我们需要通过命令下载这些js库。
命令提示符进入 package.json 所在目录,执行命令:

npm install

批量下载package.json 文件的 devDependencies 字段中
devDependencies 中的依赖
在这里插入图片描述

查看安装的模块

方式1:可以安装目录 node_modules 下的查看包是否还存在
方式2:可以使用以下命令查看:
查看安装的所有模块

npm list 或npm  ls

查看制定的模块

npm  list <Module Name>

在这里插入图片描述
查看模块的最新版本

 npm view <Module Name> versions

例如JQuery查看最新版本

 npm view jquery version

查看JQuery所有的版本

 npm view jquery versions

在这里插入图片描述

卸载模块

卸载局部模块

npm uninstall <Module Name>

卸载全局模块

npm uninstall -g <Module Name>

在这里插入图片描述
可以看出package.json里面jquery已经卸载
在这里插入图片描述

配置淘宝镜像

1查看当前使用的镜像地址

npm get registry

在这里插入图片描述
2. 配置淘宝镜像地址

npm config set registry https://registry.npm.taobao.org

3下载模块

npm install <Module Name>

4还原镜像地址

 npm config set registry https://registry.npmjs.org/
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值