前端工程化之包管理器

在这里插入图片描述

在这里插入图片描述

这里写目录标题

  • 什么是包
  • 包管理工具
  • 常用的包管理工具
    • npm
      • npm 基本使用
        • 初始化
        • 搜索工具包
        • 下载安装包
        • 导入 npm 包基本流程
        • 生产依赖与开发依赖
        • 全局安装
        • 安装全部依赖
        • 安装指定版本的包
        • 删除依赖包
    • cnpm
      • 全局安装
      • nrm 的使用
    • yarn
      • 全局安装
      • yarn 常用命令
    • pnpm 【推荐使用】
    • 全局安装

什么是包

● 包是一组特定功能的代码集合，英文为：package。
● 包，本质上是一种文件系统的集成描述形式，属于模块化的一种超集体现。

包管理工具

集中式管理『包』的应用软件，可以对「包」进行 下载，安装 ， 更新 ， 删除 ， 上传 等操作
借助包管理工具，可以快速开发项目，提升开发效率
包管理工具是一个通用的概念，很多编程语言都有包管理工具

常用的包管理工具

  • npm （ node js 内置 官网）
  • pnpm
  • yarn
  • cnpm

npm

在这里插入图片描述

npm 全称 Node Package Manager ，翻译为中文意思是『Node 的包管理工具』
npm 是 node.js 官方内置的包管理工具，是必须要掌握住的工具
node.js 在安装时会 自动安装 npm
可以通过 npm -v 查看版本号测试，如果显示版本号说明安装成功，反之安装失败

npm 基本使用

初始化
  • 创建一个空目录，然后以此目录作为工作目录 启动命令行工具 ，执行 npm init
  • npm init 命令的作用是将文件夹初始化为一个『包』， 交互式创建 package.json 文件
  • package.json 是包的配置文件，每个包都必须要有 package.json
  • package.json 内容示例：
{
"name": "1-npm", #包的名字
"version": "1.0.0", #包的版本
"description": "", #包的描述
"main": "index.js", #包的入口文件
"scripts": { #脚本配置
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "", #作者
"license": "ISC" #开源证书
}

在这里插入图片描述

搜索工具包
  1. 命令行 『npm s / search 包名』
  2. 网站搜索 网址是 https://www.npmjs.com/ （推荐）
下载安装包

我们可以通过 npm install 和 npm i 命令安装包

如：

npm install uniq --save   或   npm i uniq -S

运行之后文件夹下会增加两个资源

  • node_modules 文件夹 存放下载的包

  • package-lock.json 包的锁文件 ，用来锁定包的版本

  • 关于package-lock.json 中的版本限制的说明：

    • ^：锁定主版本号，接受所有以1开头的版本，如：1.0.2等，但不包括2.0.0。
    • ~：允许安装小版本的更新，但不包括次要版本的更改。~1.0.1 允许 1.0.x。
    • >：允许比指定版本更高的版本，但不包括指定版本本身。>1.0.1 允许 1.0.2, 1.1.0, 2.0.0等。
    • <：允许比指定版本更低的版本。<1.0.1 允许 1.0.0 及更早的版本。
    • >=：允许指定版本及更高的版本。>=1.0.1 允许 1.0.1 及其之后的版本。
    • <=：允许指定版本及更低的版本。<=1.0.1 允许 1.0.1 及其之前的版本。
    • *：允许任何版本，这种情况下最不限制，但也最不稳定。

  • 如果没有任何符号，只写版本号，如 1.0.1，这意味着严格要求安装这个特定版本。

导入 npm 包基本流程
  1. 在当前文件夹下 node_modules 中寻找同名的文件夹
  2. 在上级目录中下的 node_modules 中寻找同名的文件夹，直至找到磁盘根目录
生产依赖与开发依赖

我们可以在安装时设置选项来区分 依赖的类型 ，目前分为两类：

类别命令描述说明
生产依赖npm i -S 包名

npm i --save 包名		-S 等效于 --save， -S 是默认选项
包信息保存在 package.json 中 dependencies 属性		开发环境、生产环境都要用的，是生产依赖包。
开发依赖npm i -D 包名

npm i --save-dev 包名		-D 等效于 --save-dev

包信息保存在 package.json 中 devDependencies 属性		只有开发环境用到的包，是开发依赖包。
全局安装

我们可以执行安装选项 -g 进行全局安装

npm install -g 包名
  • 全局安装的命令不受工作目录位置影响
  • 可以通过 npm root -g 可以查看全局安装包的位置
  • 通过 npm list -g 查看全局包的列表
  • 不是所有的包都适合全局安装，通常是命令行工具包，才适合全局安装。
安装全部依赖

在项目协作中有一个常用的命令就是 npm i ，通过该命令可以依据 package.json 和 packagelock.json 的依赖声明安装项目依赖
若只想安装生产依赖，可以使用npm install --prod 或 npm i --omit=dev

npm i
或
npm install
安装指定版本的包

项目中可能会遇到版本不匹配的情况，有时就需要安装指定版本的包，可以使用下面的命令的

## 格式
npm i <包名@版本号>## 示例
npm i jquery@1.11.2

查看一个包的所有版本

npm view 包名 versions
删除依赖包
## 局部删除
npm remove 包名
npm r 包名
## 全局删除
npm remove -g 包名
npm r -g 包名

以上就是对包管理工具进行了一个初步的介绍，其余的几种包管理工具的核心，概念和使用方法都是大同小异，只要将 npm 掌握了，其它的也就很容易上手了。

cnpm

在这里插入图片描述
cnpm 是一个 npm 的替代工具，cnpm 服务器部署在国内，主要用于在国内优化 npm 包的下载速度，cnpm 由淘宝团队创建和维护，又称：淘宝镜像。

  • npm原始服务器地址：https://registry.npmjs.org/
  • cnpm服务器地址为：https://registry.npmmirror.com/
  • cnpm：官网

全局安装

  • 对于cnpm 的使用有两种方式：
    • 第一种方式：安装 cnpm 包管理器 
 npm install cnpm -g --registry=https://registry.npmmirror.com

该种方式是全局安装了 cnpm 包，并且切换了包的下载源，以后全局用 cnpm 命令即可，cnpm兼容npm命令

  • 第二种方式：仅修改npm服务器地址
npm config set registry https://registry.npmmirror.com

该种方式只是修改了npm服务器地址，以后还是用npm命令
npm 原始远程服务器地址为 https://registry.npmjs.org/

查看下载服务器源地址

npm config get registry

nrm 的使用

nrm（NPM Registry Manager）是一个用于管理npm注册表的工具，方便用户在多个npm注册表之间切换。它适用于在不同的npm源之间快速切换。

  • 安装
npm install nrm -g
  • 列出可用地址
nrm ls
  • 添加新地址
nrm add 别名 URL
  • 切换到指定地址
nrm use 别名
  • 测试各地址速度
nrm test
  • 删除地址
nrm del 别名

yarn

在这里插入图片描述
yarn是一个快速、可靠的依赖管理工具，由 Facebook 在 2016 年开发，yarn的优势如下：

  • 速度：yarn使用并行安装机制来加快速度。
  • 缓存：yarn会缓存每个下载过的包，无需重复下载。
  • 界面：yarn提供更详细的输出，包括进度条等等。
  • 安全：yarn会通过算法校验每个安装包的完整性。
  • yarn：官网

备注：以上 yarn 的优势，目前最新的 npm 也都基本具备了。所以这些优势如今并不明显

全局安装

npm i yarn -g

备注：安装 yarn 后，需要在系统全局配置环境变量

yarn 常用命令

yarn 命令功能描述对应 npm 命令
yarn init初始化包npm init
yarn -v查看版本号npm -v
yarn add 包名安装某个包npm install 包名
yarn add 包名 -D安装某个包（开发依赖）npm install 包名 -D
yarn global add 包名全局安装一个包npm install 包名 -g
yarn global dir查看全局安装位置npm root -g
yarn global list查看全局安装列表npm list -g
yarn install安装全部依赖npm install
yarn remove 包名删除包npm remove 包名
yarn run 别名运行命令别名npm run 别名

pnpm 【推荐使用】

在这里插入图片描述

pnpm（“performant npm”）是一个高效的包管理工具，与npm和yarn类似。它通过硬链接和软链接来共享依赖库，从而节省磁盘空间和加速安装过程。并且很好的解决了幻影依赖的问题

pnpm：官网
点击了解幻影依赖

全局安装

npm install pnpm -g

在这里插入图片描述

🚵‍♂️ 博主座右铭：向阳而生，我还在路上！
——————————————————————————————
🚴博主想说：将持续性为社区输出自己的资源，同时也见证自己的进步！
——————————————————————————————
🤼‍♂️ 如果都看到这了，博主希望留下你的足迹！【📂收藏！👍点赞！✍️评论！】
——————————————————————————————

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.hqwc.cn/news/688144.html

如若内容造成侵权/违法违规/事实不符，请联系编程知识网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

亚信安慧AntDB新篇章：数据库技术飞跃

亚信安慧AntDB新篇章：数据库技术飞跃

随着大数据时代的到来&#xff0c;对数据库的需求愈发强烈。在这一背景下&#xff0c;国产数据库逐渐崭露头角&#xff0c;亚信安慧AntDB作为重要的代表产品之一正积极参与到激烈的市场竞争中。亚信安慧AntDB不仅追求技术的革新和突破&#xff0c;同时也致力于满足用户日益增长…
阅读更多...
决策树的学习（Decision Tree）

决策树的学习（Decision Tree）

1.对于决策树的概念&#xff1a; **本质上&#xff1a;**决策树就是模拟树的结构基于 if-else的多层判断 2.目的&#xff1a; 对实例进行分类的树形结构&#xff0c;通过多层判断&#xff0c;将所提供的数据归纳为一种分类规则。 3.优点&#xff1a; 1.计算量小&#xff0c;…
阅读更多...
java版数据结构：堆，大根堆，小根堆

java版数据结构：堆，大根堆，小根堆

目录 堆的基本概念&#xff1a; 如何将一个二叉树调整成一个大根堆&#xff1a; 转成大根堆的时间复杂度 根堆中的插入&#xff0c;取出数据&#xff1a; 堆的基本概念&#xff1a; 堆是一种特殊的树形数据结构&#xff0c;它满足以下两个性质&#xff1a; 堆是一个完全二叉…
阅读更多...
书生作业：LMDeploy

书生作业：LMDeploy

自己随便说几句。 关于模型部署&#xff0c;很有趣的一件事就是&#xff0c;它一路随着深度学习训练一起发展&#xff0c;尽管例如tensorrt等工具的出现&#xff0c;不断试图降低部署门槛&#xff0c;但是实际上&#xff0c;每一次AI的升级&#xff0c;似乎让这个细分领域没有…
阅读更多...
python代码学习案例-用turtle库绘制爱心图形效果

python代码学习案例-用turtle库绘制爱心图形效果

Python爱心代码&#xff0c;我们可以使用多种方法&#xff0c;包括使用turtle库来绘制图形&#xff0c;或者使用字符打印来在控制台中显示爱心。 首先&#xff0c;确保你已经安装了Python&#xff0c;并且你的环境支持turtle库&#xff08;它通常是Python标准库的一部分&#…
阅读更多...
Mybatis-Plus常用的增删改查坑

Mybatis-Plus常用的增删改查坑

添加依赖 <!--实体类上加上Data注解就不用写get&#xff0c;set&#xff0c;toString&#xff0c;equals等方法了--><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional…
阅读更多...
STL——queue容器【队列】

STL——queue容器【队列】

queue的基本概念&#xff1a; 概念&#xff1a;queue是一种先进先出的数据结构&#xff0c;它有两个出口 queue的构造函数&#xff1a; 构造函数&#xff1a; queue<T>que:采用模板类实现&#xff0c;queue对象的默认构造形式 queue(const queue &que):拷贝构造函…
阅读更多...
利用OpenShift的ImageStream部署临时版本

利用OpenShift的ImageStream部署临时版本

公司是港企&#xff0c;项目都部署在OpenShift上统一管理&#xff0c;因为运行环境为香港网络(外网)&#xff0c;配置、中间件等大陆无法直接访问联通。因此在大陆开发时&#xff0c;测试是个很大的问题。为了避免往Git上频繁提交未确定可用的版本&#xff0c;选择用利用OpenSh…
阅读更多...
Python 日志模块Loguru基本使用和封装使用

Python 日志模块Loguru基本使用和封装使用

【一】介绍 Loguru是一个用于Python的日志库&#xff0c;它的设计目标是使日志记录变得简单、快速且易于阅读。 &#xff08;1&#xff09;Loguru介绍 简洁的API&#xff1a;Loguru提供了一个简洁的API&#xff0c;使得在Python项目中使用日志变得更加容易。只需导入loguru模…
阅读更多...
智慧公厕的技术基础、保障技术和应用价值

智慧公厕的技术基础、保障技术和应用价值

近年来&#xff0c;随着信息技术的快速发展&#xff0c;智慧公厕逐渐成为城市管理的热点项目。智慧公厕利用物联网技术与大数据、云计算、网络通信、自动化控制等先进技术相结合&#xff0c;公共厕所的管理变得更加快捷高效&#xff0c;实现了真正的智能化使用和智慧化管理。下…
阅读更多...
LeetCode例题讲解:844.比较含退格的字符串

LeetCode例题讲解:844.比较含退格的字符串

给定 s 和 t 两个字符串&#xff0c;当它们分别被输入到空白的文本编辑器后&#xff0c;如果两者相等&#xff0c;返回 true 。# 代表退格字符。 注意&#xff1a;如果对空文本输入退格字符&#xff0c;文本继续为空。 示例 1&#xff1a; 输入&#xff1a;s "ab#c&qu…
阅读更多...
大米自动化生产线揭秘：包装设备选择与维护之道

大米自动化生产线揭秘：包装设备选择与维护之道

在现代化的大米生产过程中&#xff0c;自动化生产线的应用已经越来越广泛。其中&#xff0c;包装设备作为生产线上的重要一环&#xff0c;其选择与维护直接关系到产品的质量和生产效率。与星派一起探讨大米自动化生产线中包装设备的选择与维护之道。 一、包装设备的选择 在选择…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023