package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

时间:2021-06-26 23:10:45

package.json文件中,我们常常会看到这样的代码,并且也知道如何去执行脚本命令,但是,我们为什么可以这样使用呢?通过仔细阅读几篇文章,已经基本得到了答案,这里做一个简单的提炼、理解和记录。
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

一、什么是 npm 脚本

package.json文件里面的scripts字段中定义的就是npm脚本
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

二、npm脚本的原理

每当执行npm run,就会自动新建一个 Shell,在这个 Shell 里面执行指定的脚本命令。
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

三、什么是shell和bash

Shell,直译过来就是“壳”的意思,它的官方定义如下:
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

总的来说,shell就是充当了计算机命令与计算机语言(0和1)的翻译官。当我们在控制台发出指令后,经过shell的翻译这些命令将变成计算机语言,也就是1和0,最后反映在高低电压的不同上,然后计算机中的那些电子器件就能按照我们的要求进行相应的动作了。而bash呢,就是shell的一种,shell可以看做是一种语言名称,其具体的语法则遵循bashcsh的规定。

四、传参

向 npm 脚本传入参数,要使用--标明。

五、默认值

package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

六、简写形式

package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

七、NODE_ENV是什么

想要知道NODE_ENV是什么,首先要了解process.env对象,它是Node.js中暴露出来的系统环境变量,因此我们可以对process.env添加一个自定义属性NODE_ENV并设置值,而之所以我们在设置的时候直接这样写: NODE_ENV=production,可能是scripts中定义的变量会默认添加到process.env下面
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

八、实际应用

package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)
package.json文件scripts脚本解读(npm scripts && shell和bash && process.env && NODE_ENV && cross-env)

参考链接1:http://www.ruanyifeng.com/blog/2016/10/npm_scripts.html => npm scripts 使用指南
参考链接2:https://www.jianshu.com/p/a702a01db5c7 => 什么是shell和bash
参考链接3:https://www.jianshu.com/p/83e8909fc1cd => NODE_ENV
参考链接4:https://nodejs.org/dist/latest-v10.x/docs/api/process.html#process_process_env => process.env
参考链接5:https://www.npmjs.com/package/cross-env => cross-env