当前位置: 首页 > news >正文

包管理工具

代码共享方案

放到npm仓库,下载到本地放到node_modules

npm配置文件

必须填写的属性:name、version
name是项目的名称;
version是当前项目的版本号;
description是描述信息,很多时候是作为项目的基本描述;
author是作者相关信息(发布时用到);
license,是开源协议(发布时用到);
private属性记录当前的项目是否是私有的;当值为true时,npm是不能发布它的,这是防止私有项目或模块发布出去的方式;

配置文件获得方式
  • npm init
  • cli脚手架生成
常见属性:
必须填写的属性:name、version

name是项目的名称;
version是当前项目的版本号;
description是描述信息,很多时候是作为项目的基本描述;
author是作者相关信息(发布时用到);
license是开源协议(发布时用到);

private属性:

private属性记录当前的项目是否是私有的;
当值为true时,npm是不能发布它的,这是防止私有项目或模块发布出去的方式

main属性:

比如我们使用axios模块const axios=require(‘axios’)
如果有main属性,实际上是找到对应的main属性查找文件的;

scripts属性:

scripts属性用于配置一些脚本命令,以键值对的形式存在;口配置后我们可以通过npm run命令的key来执行这个命令;
npm start和npm run start的区别是什么?
它们是等价的:
对于常用的start.、test、stop、restart可以省略掉run直接通过npm starts等方式运行;

dependencies属性

dependencies属性是指定无论开发环境还是生成环境都需要依赖的包:通常是我们项目实际开发用到的一些库模块vue、vuex、ue-router、.react、react–dom、axios等等:与之对应的是devDependencies;

devDependencies属性

一些包在生成环境是不需要的,比如webpack、babel等,这个时候我们会通过npm install webpack-save-dev,将它安装到devDependencies属性中;

peerDependencies属性

还有一种项目依赖关系是对等依赖,也就是你依赖的一个包,它必须是以另外一个宿主包为前提的;
比如element-plus是依赖于vue3的,ant design是依赖于react、react-dom;

项目安装

  1. 项目安装会在当前目录下生成一个node modules文件夹,我们之前讲解require查找顺序时有讲解过这个包在什么情况下被查找;
  2. 局部安装分为开发时依赖和生产时依赖:
#默认安装开发和生产依赖
npm install axios
npm i axios
#开发依赖
npm install webpack --save-dev
npm install webpack -D
npm i webpack -D
#根据package.json中的依赖包
npm install

npm install原理

  1. 执行npm install’它背后帮助我们完成了什么操作?
  2. 我们会发现还有一个称之为package-lock.json的文件,它的作用是什么?
  3. 从npm5开始,npm支持缓存策略(来自yarn的压力),缓存有什么作用呢?
    在这里插入图片描述

yarn

cnpm

npx

npx的作用非常多,但是比较常见的是使用它来调用项目中的某个模块的指令

以webpack为例:

​ 全局安装的是webpack5.1.3
​ 项目安装的是webpack3.6.0

执行webpack --version

显示结果会是webpack5.1.3,事实上使用的是全局的,为什么呢?

原因非常简单,在当前目录下找不到webpack时,就会去全局找,并且执行命令;

执行局部命令

方式一:明确查找到node module下面的webpack
方式二:在scripts定义脚本,来执行webpack;.

./node modules/.bin/webpack --version
"scripts":{
"webpack":"webpack --version"
)
npx webpack --version

npx的原理非常简单,它会到当前目录的node modules/bin目录下查找对应的命令;

以前包管理工具的痛点:

在这里插入图片描述

每一次安装都要安装这些插件,就会造成磁盘很多冗余文件,于是pnpm就诞生了。

pnpm

  1. 快,节省内存
  2. 支持monorepos
OS硬链接和软连接的概念

硬链接(英语:hard link)是电脑文件系统中的多个文件平等地共享同一个文件存储单元
删除一个文件名字后,还可以用其它名字继续访问该文件:

指向的是同一个,修改了a,b也会被影响。

编辑东西在硬链接里面编辑,软连接编辑不了

符号连接(软连接)

符号链接(软链接、Symbolic link)是一类特殊的文件:
其包含有一条以绝对路径或者相对路径的形式指向其它文件或者目录的引用

快捷方式:保存一个文件的快捷方式(路径)。不能够通过软连接来编辑。

也是为什么当硬链接删除掉,符号链接没用了!

测试软硬连接

在这里插入图片描述

  1. 文件的拷贝:再在磁盘里面复制一份文件,然后再创建一个硬链接指向磁盘里面的文件。
  2. 文件的硬链接:创建两个方式共享同一个文件 —cmd测试
  3. 创建一个符号连接指向硬链接的地方,不能够通过符号连接,来更改源文件的内容。 — cmd测试
pnpm的工作原理

当使用npm或Yarn时,如果你有100个项目,并且所有项目都有一个相同的依赖包,那么,你在硬盘上就需要保存100份该相同依赖包的副本。如果是使用pnpm,依赖包将被存放在一个统一的位置

  1. 如果你对同一依赖包使用相同的版本,那么磁盘上只有这个依赖包的一份文件;
  2. 不同的版本,也只会保存不相同的文件
  3. 所有文件都保存在硬盘上的统一的位置
    1. 当安装软件包时,其包含的所有文件都会硬链接到此位置,而不会占用额外的硬盘空间
创建非扁平的node_modules

当使用npm或Yarn安装依赖包时,所有软件包都将被提升到node_modules的根目录下。因为npm觉得,不同包如果依赖的其他包相同的时候,不应该再次创建一个包,因此所有的包都会被提升到同一目录结构当中。

但是pnpm完美解决了这个问题,它虽然是非扁平的结构,但是它并不是生成真正的文件在这里,他是生成一个硬链接指向磁盘中的位置。

pnpm的存储store

pnpm在依赖查找的时候,会先去pnpm store中查找硬链接,pnpm store中是一大堆的hash字符,通过这写hash字符,可以查找到硬链接,再将本项目的node_modules指向这个硬链接。

pnpm store path 查找路径指令

释放pnpm空间

有时候删除了项目,所有的项目都没有依赖到那个包,但是pnpm store里面不会自动删除这个包。如果我们想要释放pnpm的空间,可以使用pnpm store prune这个命令。

总结:

  1. npm
  2. yarn
  3. cnpm
  4. pnpm

参考

codewhy包的讲解

s指向这个硬链接。

pnpm store path 查找路径指令

释放pnpm空间

有时候删除了项目,所有的项目都没有依赖到那个包,但是pnpm store里面不会自动删除这个包。如果我们想要释放pnpm的空间,可以使用pnpm store prune这个命令。

总结:

  1. npm
  2. yarn
  3. cnpm
  4. pnpm

参考

codewhy包的讲解

相关文章:

包管理工具

代码共享方案 放到npm仓库,下载到本地放到node_modules npm配置文件 必须填写的属性:name、version name是项目的名称; version是当前项目的版本号; description是描述信息,很多时候是作为项目的基本描述&#xff1b…...

Qt第六十五章:自定义菜单栏的隐藏、弹出

目录 一、效果图 二、qtDesigner 三、ui文件如下: 四、代码 一、效果图 二、qtDesigner 原理是利用属性动画来控制QFrame的minimumWidth属性。 ①先拖出相应的控件 ②布局一下 ③填上一些样式 相关QSS background-color: rgb(238, 242, 255); border:2px sol…...

element table中嵌套el-select 无法选择问题

<el-table-column align"left" label"姓名" show-overflow-tooltip :key"tableKey"><template slot-scope"scope"><el-select placeholder"请选择" :disabled"!saveButton" v-model"scope.ro…...

2.6.C++项目:网络版五子棋对战之数据管理模块-游戏房间管理模块的设计

文章目录 一、意义二、功能三、作用四、游戏房间类基本框架五、游戏房间管理类基本框架七、游戏房间类代码八、游戏房间管理类代码 一、意义 对匹配成功的玩家创建房间&#xff0c;建立起一个小范围的玩家之间的关联关系&#xff01; 房间里一个玩家产生的动作将会广播给房间里…...

计算机视觉中的数据预处理与模型训练技巧总结

计算机视觉主要问题有图像分类、目标检测和图像分割等。针对图像分类任务&#xff0c;提升准确率的方法路线有两条&#xff0c;一个是模型的修改&#xff0c;另一个是各种数据处理和训练的技巧(tricks)。图像分类中的各种技巧对于目标检测、图像分割等任务也有很好的作用&#…...

GeoHash分享

写在前边 复制的一个内部分享&#xff0c;所以可能更偏向PPT性质&#xff0c;本文提出的问题&#xff0c;在末尾参考材料中都会有所提及&#xff0c;包括更深层次的实现原理和各大API对于GeoHash的优化。感兴趣的读者可以拓展看一下。 START GeoHash是一种地址编码&#xff…...

【超详细】CentOS 7安装MySQL 5.7【安装及密码配置、字符集配置、远程连接配置】

准备工作&#xff1a;CentOS 7系统&#xff0c;并确保可以联通网络 1、获取MySQL 5.7 Community Repository软件包 注意&#xff1a;这里使用的是root用户身份。 wget https://dev.mysql.com/get/mysql57-community-release-el7-8.noarch.rpm2、安装软件包 rpm -ivh mysql5…...

Elasticsearch 8.X 分词插件版本更新不及时解决方案

1、关于 Elasticsearch 8.X IK 分词插件相关问题 球友在 ElasticSearch 版本选型问题中提及&#xff1a;如果要使用ik插件&#xff0c;是不是就使用目前最新的IK对应elasticsearch的版本“8.8.2”&#xff1f; https://github.com/medcl/elasticsearch-analysis-ik/releases/ta…...

Delete `␍`eslintprettier/prettier

将CRLF改为LF 然后就消失了 除此之外,也可以修改git全局配置 git config --global core.autocrlf false...

4种实用的制作URL 文件的方法

很多小伙伴有自己的博客、淘宝或者共享文件网站&#xff0c;想要分享、推广自己的网址做成url文件&#xff0c;让别人点击这个url文件直接访问自己的网站。URL文件其实就一个超级链接&#xff0c;制作的方法很多&#xff0c;这里列举4种。 收藏网站直接拖拽 1.第一种&#xf…...

css总结

记录做项目经常会写到的css 1、左边导航栏固定&#xff0c;右边div占满剩余宽度 <template><div class"entrance"><div class"left"></div><div class"right"><div class"content"></div>…...

[C语言]排序的大乱炖——喵喵的成长记

宝子&#xff0c;你不点个赞吗&#xff1f;不评个论吗&#xff1f;不收个藏吗&#xff1f; 最后的最后&#xff0c;关注我&#xff0c;关注我&#xff0c;关注我&#xff0c;你会看到更多有趣的博客哦&#xff01;&#xff01;&#xff01; 喵喵喵&#xff0c;你对我真的很重要…...

Docker 网络与Cgroup资源限制

目录 一、Docker 网络实现原理&#xff1a; 二、Docker 的网络模式&#xff1a; 三、网络模式详解&#xff1a; 1. host模式&#xff1a; 2. container模式&#xff1a; 3. none模式: 4&#xff0e;bridge模式: 5&#xff0e;自定义网络: 四、Cgroup资源控制&#xff1a; …...

D - United We Stand

思路&#xff1a; &#xff08;1&#xff09;题目要求将集合A划分为B&#xff0c;C两组&#xff0c;使得C中任意数都不是B中的除数 &#xff08;2&#xff09;直观感受&#xff0c;只要让C中数比B中大&#xff0c;则满足条件&#xff0c;不妨只取最大的放入C中&#xff1b; …...

【1.总纲】

目录 知识框架No.0 总纲安排No.1课程安排一、目标二、内容三、 学到 No.2 深度学习介绍一、AI地图二、图片分类三、物体检测和分割四、样式迁移五、人脸合成六、文字生成图片七、文字生成-GPT八、无人驾驶九、广告点击 No.3 安装No.3 安装 知识框架 No.0 总纲安排 B站网址&…...

I/O模型之非阻塞IO

简介 五种IO模型   阻塞IO   非阻塞IO   信号驱动IO   IO多路转接    异步IO 代码书写 非阻塞IO 再次理解IO 什么是IO&#xff1f;什么是高效的IO&#xff1f; 为了理解后面的一个问题&#xff0c;我们首先要再重新理解一下什么是IO 在之前的网络介绍中&#xff…...

2023版 STM32实战11 SPI总线读写W25Q

SPI全称 英文全称&#xff1a;Serial peripheral Interface 串行外设接口 SPI特点 -1- 串行(逐bit传输) -2- 同步(共用时钟线) -3- 全双工(收发可同时进行) -4- 通信只能由主机发起(一主,多从机) 开发使用习惯和理解 -1- CS片选一般配置为软件控制 -2- 片选低电平有效,从…...

Spring Security认证源码解析(示意图)

建议先看完Spring Security总体架构介绍和Spring Security认证架构介绍&#xff0c;然后从FilterChainProxy的doFilterInternal函数开始&#xff0c;配合文章进行debug以理解Spring Security认证源码的执行流程。 在之前的Spring Security认证架构介绍中&#xff0c;我们已经知…...

2023.10.22 关于 定时器(Timer) 详解

目录 引言 标准库定时器使用 自己实现定时器的代码 模拟实现的两大方面 核心思路 重点理解 自己实现的定时器代码最终代码版本 引言 定时器用于在 预定的时间间隔之后 执行特定的任务或操作 实例理解&#xff1a; 在服务器开发中&#xff0c;客户端向服务器发送请求&#…...

【STM32】GPIO控制LED(寄存器版)

在开始之前记得先准备好环境&#xff1a; STM32F103核心板下载教程.pdf 林何/STM32F103C8 - 码云 - 开源中国 (gitee.com) 一、STM32的GPIO模块数据手册详解 每个GPIO端口对应16个引脚&#xff0c;例GPIOA&#xff08;PA0~PA15&#xff09;内核cpu就可以通过APB2总线对寄存器…...

大数据零基础学习day1之环境准备和大数据初步理解

学习大数据会使用到多台Linux服务器。 一、环境准备 1、VMware 基于VMware构建Linux虚拟机 是大数据从业者或者IT从业者的必备技能之一也是成本低廉的方案 所以VMware虚拟机方案是必须要学习的。 &#xff08;1&#xff09;设置网关 打开VMware虚拟机&#xff0c;点击编辑…...

Cinnamon修改面板小工具图标

Cinnamon开始菜单-CSDN博客 设置模块都是做好的&#xff0c;比GNOME简单得多&#xff01; 在 applet.js 里增加 const Settings imports.ui.settings;this.settings new Settings.AppletSettings(this, HTYMenusonichy, instance_id); this.settings.bind(menu-icon, menu…...

华为云Flexus+DeepSeek征文|DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建

华为云FlexusDeepSeek征文&#xff5c;DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建 前言 如今大模型其性能出色&#xff0c;华为云 ModelArts Studio_MaaS大模型即服务平台华为云内置了大模型&#xff0c;能助力我们轻松驾驭 DeepSeek-V3/R1&#xff0c;本文中将分享如何…...

初探Service服务发现机制

1.Service简介 Service是将运行在一组Pod上的应用程序发布为网络服务的抽象方法。 主要功能&#xff1a;服务发现和负载均衡。 Service类型的包括ClusterIP类型、NodePort类型、LoadBalancer类型、ExternalName类型 2.Endpoints简介 Endpoints是一种Kubernetes资源&#xf…...

C++:多态机制详解

目录 一. 多态的概念 1.静态多态&#xff08;编译时多态&#xff09; 二.动态多态的定义及实现 1.多态的构成条件 2.虚函数 3.虚函数的重写/覆盖 4.虚函数重写的一些其他问题 1&#xff09;.协变 2&#xff09;.析构函数的重写 5.override 和 final关键字 1&#…...

Java 与 MySQL 性能优化:MySQL 慢 SQL 诊断与分析方法详解

文章目录 一、开启慢查询日志&#xff0c;定位耗时SQL1.1 查看慢查询日志是否开启1.2 临时开启慢查询日志1.3 永久开启慢查询日志1.4 分析慢查询日志 二、使用EXPLAIN分析SQL执行计划2.1 EXPLAIN的基本使用2.2 EXPLAIN分析案例2.3 根据EXPLAIN结果优化SQL 三、使用SHOW PROFILE…...

Windows电脑能装鸿蒙吗_Windows电脑体验鸿蒙电脑操作系统教程

鸿蒙电脑版操作系统来了&#xff0c;很多小伙伴想体验鸿蒙电脑版操作系统&#xff0c;可惜&#xff0c;鸿蒙系统并不支持你正在使用的传统的电脑来安装。不过可以通过可以使用华为官方提供的虚拟机&#xff0c;来体验大家心心念念的鸿蒙系统啦&#xff01;注意&#xff1a;虚拟…...

WebRTC调研

WebRTC是什么&#xff0c;为什么&#xff0c;如何使用 WebRTC有什么优势 WebRTC Architecture Amazon KVS WebRTC 其它厂商WebRTC 海康门禁WebRTC 海康门禁其他界面整理 威视通WebRTC 局域网 Google浏览器 Microsoft Edge 公网 RTSP RTMP NVR ONVIF SIP SRT WebRTC协…...

密码学基础——SM4算法

博客主页&#xff1a;christine-rr-CSDN博客 ​​​​专栏主页&#xff1a;密码学 &#x1f4cc; 【今日更新】&#x1f4cc; 对称密码算法——SM4 目录 一、国密SM系列算法概述 二、SM4算法 2.1算法背景 2.2算法特点 2.3 基本部件 2.3.1 S盒 2.3.2 非线性变换 ​编辑…...

webpack面试题

面试题&#xff1a;webpack介绍和简单使用 一、webpack&#xff08;模块化打包工具&#xff09;1. webpack是把项目当作一个整体&#xff0c;通过给定的一个主文件&#xff0c;webpack将从这个主文件开始找到你项目当中的所有依赖文件&#xff0c;使用loaders来处理它们&#x…...