webpack的安装及其后序部分

npm install原理

这个其实就是npm从registry下载项目到本地,没有什么好说的

值得一提的是npm的缓存机制,如果多个项目都需要同一个版本的axios,每一次重新从registry中拉取的成本过大,所以会有缓存,如果缓存里有这个包那直接从缓存中直接拉取解压了

怎么确定找到的就是自己需要的那个包呢?是有对应的标识符的,这个标识符就在package-lock.json里面

版本的具体也可以在package-lock.json中找(具体安装的版本)

package-lock.json文件解析

name:项目的名称

version:项目的版本

lockfileVersion:lock文件的版本

requires:使用requires来跟踪模块的依赖关系

dependencies:项目的依赖

当前项目依赖axios,但是axios依赖follow-redireacts

axios中的属性:

version表示实际安装的axios版本

resolved用来记录下载的地址,registry仓库中的位置

requires/dependencies记录当前模块的依赖

integrity用来从缓存中获取索引,在通过索引去获取压缩包文件

npm install原理深入

从npm5开始,npm就支持缓存策略了(来自yarn的压力),那么缓存有什么作用呢?

介素一副原理图:

npm其他命令

介绍一下npm其他的几个常用的命令

卸载某个依赖包:

javascript 复制代码
npm uninstall package
npm uninstall package --save-dev
npm uninstall package -D

强制重新build:

bash 复制代码
npm rebuild

清除缓存:

javascript 复制代码
npm cache clean

npm的命令很多捏:

https://docs.npmjs.com/cli-documentation/cli

可以查看文档查命令

yarn工具

yarn工具和npm差不多,所做的事情也差不多

即生npm,何生yarn

yarn其实是为了弥补早期npm的一些缺陷(安装依赖速度慢,版本依赖混乱)而出现的

从npm5版本开始,进行了很多的升级和改进,很多人依然喜欢用yarn

命令和使用都差不多

想要添加包的话是

javascript 复制代码
yarn add

cnpm

每一种工具都有自己的适用场景

cnpm是中国适用

由于一些特殊原因,某些情况下没办法很好的从https://registry.npmjs.org下载下来一些需要的包

所以一些东西就会被存到镜像服务器仓库里

可以这样查看npm的镜像:

bash 复制代码
npm config get registry

也可以直接设置npm的镜像:

bash 复制代码
npm config set registry https://registry.npm.taobao.org

但是有的人就不希望再将npm的镜像修改了,一方面不希望随意修改npm原本从官方下来包的渠道,另一方面如果镜像挂了或者停止维护就又要改来改去了。。

这个时候就可以用cnpm并将它设置成淘宝的镜像

javascript 复制代码
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm config get registry #https://r.npm.taobao.org
相关推荐
未来读啥科教资讯2 分钟前
2026年深圳国际户外用品展览会参展效果如何?影响力如何?
前端
码农胖大海5 分钟前
浏览器及标签页关闭时登出的解决方案
前端·浏览器
喵爸的小作坊8 分钟前
StreamPanel:一个让 SSE 调试不再痛苦的 Chrome 插件
前端·后端·http
star learning white24 分钟前
xm C语言12
服务器·c语言·前端
tabzzz24 分钟前
大道至简:万字漫谈前端性能监控
前端·javascript·性能优化
0思必得032 分钟前
[Web自动化] CSS基础概念和介绍
前端·css·python·自动化·html·web自动化
小胖霞34 分钟前
全栈系列(15)github Actions自动化部署前端vue
前端·node.js·github
未来魔导34 分钟前
基于 Gin 框架的 大型 Web 项目推荐架构目录结
前端·架构·gin
foundbug9991 小时前
Modbus协议C语言实现(易于移植版本)
java·c语言·前端
Luna-player1 小时前
在前端中list.map的用法
前端·数据结构·list