注:以下讨论是以 windows 环境为例,其他环境也是类似的流程
正文
在我们写前端程序的时候经常执行这样的命令npm run dev
, 那这背后的原理是什么呢?
这里涉及到package.json
文件的 scripts
字段,比如下面的例子
"scripts": {
"dev": "vuepress dev docs",
}
参考 npm 的文档,npm run dev
就相当于 node_modules\.bin\vuepress.cmd dev docs
node_modules\.bin\vuepress.cmd
是一个 windows 下的可以直接运行的批处理程序,内容如下:
@IF EXIST "%~dp0\node.exe" (
"%~dp0\node.exe" "%~dp0\..\vuepress\vuepress.js" %*
) ELSE (
@SETLOCAL
@SET PATHEXT=%PATHEXT:;.JS;=;%
node "%~dp0\..\vuepress\vuepress.js" %*
)
其作用就是使用 node 来运行 node_modules\vuepress\vuepress.js
用命令来表示就是
node node_modules\vuepress\vuepress.js dev docs
总结
1.当我们一个项目,它的 package.json
文件的 scripts
字段,比如下面的例子
"scripts": {
"dev": "vuepress dev docs",
}
2.当我们运行npm run dev
的时候,其实相当于运行了
node node_modules\vuepress\vuepress.js dev docs
为什么会是 node_modules\vuepress\vuepress.js
这是因为 vuepress 包的 package.json
有如下的内容:
"bin": {
"vuepress": "vuepress.js"
}
这表示了这个包会提供一个vuepress
命令程序,这个程序实际执行的是 vuepress\vuepress.js
文件