npm run xx 的执行流程

npm run xx 的执行流程

npm run xxx 的这个xxx是在package.json中配置的。
package.json中的scripts中的key为xxx，value为实际的命令。

npm run xxx的时候，首先会去项目的package.json文件里找scripts 里找对应的xxx，然后执行 xxx的命令，例如启动vue项目 npm rum serve 实际上执行了npm run vue-cli-service serve --open

vue-cli 2.0

"script":{
  "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
  "start": "npm run dev",
  "build": "node build/build.js"
}

vue-cli 3.0

"script":{
    "serve": "vue-cli-service serve --open",
    "build": "vue-cli-service build",
	"lint": "vue-cli-service lint"
}

为什么不直接执行vue-cli-service serve而要执行npm run serve 呢
因为操作系统中没有vue-cli-service指令，直接执行会报错。

**为什么执行npm rum serve的时候可以成功?
**
在安装依赖的时候，会在node_modules/.bin/目录中创建几个vue-cli-service为名的可执行文件,bin目录下的文件表示软连接。
使用npm run serve执行vue-cli-service serve时,会到./node_modules/.bin 中找到 vue-cli-service. 文件作为 脚本来执行，则相当于执行了./node_modules/.bin/vue-cli-service serve（最后的 serve 作为参数传入）

这个bin目录下的那些软连接文件是哪里来的呢？它又是怎么知道这条软连接是执行哪里的呢？
在库的源代码的package.json中，可以找到bin字段，用于在安装时创建软链接指向bin中的地址。

npm i 的时候，npm 就帮我们把这种软连接配置好了，其实这种软连接相当于一种映射，执行npm run xxx 的时候，就会到 node_modules/bin中找对应的映射文件，然后再找到相应的js文件来执行。

---

作者：阳光是sunny 链接：https://juejin.cn/post/7078924628525056007 来源：稀土掘金 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。