npm run xxx之后发送了什么?

背景

我们经常使用npm run serve/yarn serve 来启动项目或者执行脚本。但是在终端输入命令之后具体发生了什么,就不清楚了,之前通过一些文章了解了其中的逻辑,在这里以npm run serve为例子简单梳理了一下。

首先通过几个问题来切入一下。
Q1、为什么在终端输入npm,之后不会报错,而是会出现npm相关的提示信息,而输入其他命令比如qinyuhao时,就会报错command not found
npm run xxx之后发送了什么?_第1张图片
执行逻辑:

1.1、在输入一段指令的时候,终端会先判断指令是不是一个绝对路径,如果是就会按照这个路径去执行对应的程序,如果找不到就会报错。比如这个输入 open xxx就会打开对应文件。
在这里插入图片描述
1.2、如果不是绝对路径,就会在当前终端的目录下进行查找,在当前文件中打开终端也可以打开对应文件。
在这里插入图片描述
1.3、如果没有找到就会在操作系统的内置命令中进行查看,比如ls
在这里插入图片描述
1.4、如果还没有找到,就在在环境变量的PATH(echo $PATH)中记录的路径查找(在终端中输入env可以查看当前所以的环境变量),如果没有找到就会报错command not found

1.5、在window里面会有一个node.cmd文件,如果我们把这个文件删除,再次使用npm就会报错command not found
npm run xxx之后发送了什么?_第2张图片

Q2、基于问题一对了解,我们知道了npm run serve的npm是怎么来的,那后面的 run serve又是怎么一回事呢?

2.1、其实npm run表示执行在package.json的scripts中的配置的脚本,而serve就是其中的一个脚步,当我们输入npm run时,会提示我们当前有哪些可以运行的脚本。
npm run xxx之后发送了什么?_第3张图片
2.2、比如这里执行npm run test就会执行我们自定义的脚本文件(其实就是执行node ./test.js),并打印出来hell world,
npm run xxx之后发送了什么?_第4张图片
Q3、执行npm run xxx其实是执行后面配置的脚本指令,那为什么运行npm run serve 可以启动项目,而直接运行vue-cli-service serve就会报错command not found呢
npm run xxx之后发送了什么?_第5张图片
3.1、其实在我们运行npm run的时候,会在node_modules/.bin文件中进行查找可执行文件,比如这里其实的执行的是 ./node_modules/.bin/vue-cli-service serve
npm run xxx之后发送了什么?_第6张图片
3.2、那node_modules/.bin/vue-cli-serve是如何添加到bin文件夹下面的呢?
当我们使用npm i安装的时候,会自动在bin文件下创建很多针对不同平台的可执行文件。比如这里的.cmd / .ps就是对于cmd和powerShell来进行识别的。
npm run xxx之后发送了什么?_第7张图片
所以当我们运行npm run serve时,会在node_modules/.bin文件找,如果找不到就会在cmd里面找,在找不到就会报错。

Q4:node_modules/.bin文件下的可执行文件又是从何而来呢?
4.1、bin只是保存一个个软链接的脚本,打开文件可以看到文件顶部写着 #!/bin/sh ,表示这是一个脚本主要保存就就是映射关系,通过软连接在那个路径获取资源包。
npm run xxx之后发送了什么?_第8张图片
4.2、而在源资源包的package.json 文件中会保存每个依赖资源包对应的bin目录,当我们npm i 的时候,npm 将 bin/vue-cli-service.js 作为 bin 声明了。当使用 npm run serve 执行 vue-cli-service serve 时,虽然没有安装 vue-cli-service的全局命令,但是 npm 会到 ./node_modules/.bin 中找到 vue-cli-service 文件作为 脚本来执行,则相当于执行了 ./node_modules/.bin/vue-cli-service serve(最后的 serve 作为参数传入)
npm run xxx之后发送了什么?_第9张图片

总结

1、运行npm i 安装依赖时,npm会根据资源包的package.json的bin属性来在bin文件下保存每个资源包的软连接。
2、node_modules/.bin只是保存的是每个依赖的软连接和资源包的映射的脚本。
2、运行 npm run xxx的时候,npm 会先在当前目录的 node_modules/.bin 查找要执行的程序,如果找到则运行,没有就往上级查找直到全局的node_modules/.bin,再没有就在PATH环境变量查找,没有就报错;
3、运行 npm run xxx时,实际运行的是node_modules/.bin下面的可执行文件。

你可能感兴趣的:(npm,npm,前端,node.js)