项目中执行 npm run xxx 的时候发生了什么？
今天去面试前端的时候，面试官问到构建工具方面的知识点，其中一个问题就是 npm run xxx 的执行过程是怎样的。搜索了相关资料，整理了一下。本文将介绍，当使用 npm run 命令的时候，内部是如何执行的
package.json
npm 离不开 package.json ，要了解 npm 的运行机制，我们先看看 package.json 文件是做什么的。首先 package.json 文件是每个前端项目存在于根目录的文件，包含了项目的一些基本信息（例如项目名称，版本号，描述，一些脚本，依赖等等），大致的结构如下
{
"name": "1024nav",
"version": "1.0.0",
"description": "1024nav，前端开发者必备网站",
"main": "src/index.js",
"scripts": {
"start": "node index.js",
"lint": "eslint **/*.js"
},
"dependencies": {
"express": "^4.16.4",
"compression": "~1.7.4"
},
"devDependencies": {
"eslint": "^5.16.0",
"nodemon": "^1.18.11"
},
"repository": {
"type": "git",
"url": "https://github.com/xxx.git"
},
"author": "1024",
"contributors": [
{
"name": "Kelen",
"email": "[email protected]",
"url": "https://www.1024nav.com"
}
],
"keywords": ["server", "osiolabs", "express", "compression"]
}
我们这里重点关注 script 的配置，该配置罗列了一些可以运行的脚本，当我们在根目录执行 npm run 或者 yarn run 的时候，就会去调用这里的命令。我们拿上面的 start 命令来讲解。
当我们执行 npm run start 的时候，就会去 package.json 文件的 script 查找相关的命令，匹配到的是 start: node index.js 这个命令。
"scripts": {
"start": "node index.js",
"dev": "nodemon",
"lint": "eslint **/*.js"
}
这时候就会执行 node index.js 这个命令。（由于系统已经安装过 node，所以这个命令就可以正常执行）。那么 npm run start 跟 node index.js 有什么区别呢？为什么不直接 node index.js呢？
npm 脚本的唯一要求就是可以在 Shell 执行
全局命令和局部命令
由于 node 我们已经安装在电脑里面了，所以上面两个命令其实没啥区别，你非要用 node index.js 也是可以的。但是有时候有一些命令没有全局安装的时候，例如第二条命令的 eslint **/*.js 。你直接执行就会报错
$ eslint **/*.js
bash: eslint: command not found
主要的原因是我们没有全局安装 eslint ，所以会报错，那为什么 npm run lint 就可以顺利执行呢。为了解答这个问题，我们来看看 node_modules 文件夹的.bin 目录
.bin 目录
.bin 目录，这个目录下的文件，都是一些软链接，打开文件可以看到文件顶部写着 #!/bin/sh ，表示这是一个脚本。所以 npm run 执行的时候，当全局没有安装相关命令的时候，就会到这里去查找。
由此我们可以知道，当使用 npm run test 执行 eslint **/*.js 时，虽然没有全局安装 eslint 的全局命令，但是 npm 会到 ./node_modules/.bin 中找到 eslint 文件作为脚本来执行，则相当于执行了 ./node_modules/.bin/eslint **/*.js
总结
- 运行
npm run xxx的时候，npm 会先在当前目录的node_modules/.bin查找要执行的程序，如果找到则运行； - 没有找到则从全局的
node_modules/.bin中查找，也就是npm i -g xxx就是安装到到全局目录； - 如果全局目录还是没找到相关命令，那么就从系统的环境变量中查找同名的可执行程序。