1.scripts介绍

平时大家运行的npm run dev ，npm run build 命令都是package.json中scripts脚本命令
也是npm的script系统
image.png
npm run <script> 这是一种简写方式，我们平时使用的就是这种方式
npm run -script <script>这是它原来的样子
npm run 可以查看所有的script命令
scripts的作用：可以用于指定脚本命令，供 npm 直接调用，用一句命令依次执行编写好的脚本语句

2.原理

每当执行npm run，就会自动新建一个 Shell，在这个 Shell 里面执行指定的脚本命令。因此，只要是 Shell可以运行的命令，就可以写在 npm 脚本里面。

3.智能路径

npm run 命令会自动在环境变量 $PATH 添加 当前项目node_modules/.bin 目录, scripts 字段里面调用命令时不用加上路径。
所以我们在 package.json 文件内的 scripts 字段内指定任务的时候 一般 无需指定脚本文件的路径，
只需要将脚本放到 ./node_module/.bin/ 目录下即可，
命令会在 这个目录 下自动寻找对应的脚本文件。
而无需使用 ./node_modules/.bin/**.js
当然我们也可以自定义路径
image.png

3.一个script执行多个命令(管道任务)

script的命令可以和Linux中的管道命令一样,可以多个操作链接在一起

  1. |:连接两个任务，

    1. "and": "node src/1.js | node src/2.js"// 我没搞懂这个怎么用，总是返回后面一个文件的log内容

  2. && ：任务内部引用其他任务，子任务 顺序 执行

    1. "build1":"npm run 1js && npm run 2js"\
    2. // 第一个任务报错了 后面的任务也不会执行了
    3. // 后一个任务要等前一个任务执行完才可以执行


    image.png

  3. &:任务内部引用其他任务，子任务 平行 执行

    1. "build1":"npm run and & npm run log" //第一个报错了 不会影响第二个任务执行

    image.png

4.bash脚本

显而易见,npm 不仅仅可以执行js,shell,也可以执行bash脚本，且绝大多时候都是执行bash脚本;
关于bash脚本的编写,请看此文
写在 scripts 属性中的命令，也可以在 node_modules/.bin 目录中直接写成 bash 脚本。下面是一个 bash 脚本（命名为1.sh）。
注意:请使用git 工具命令行执行,或其他可以执行sh脚本的工具

  1.     "sh":"sh 1.sh"

image.png

5.钩子(生命周期)

和Vue的生命周期,路由钩子的概念是一样,每个script命令都有钩子
前置钩子pre<script>,后置钩子post<script>。
在运行命令npm run p npm会自动在scripts中寻找prep和postp命令执行
可以使用node的环境变量process.env.npm_lifecycle_event 来获取当前执行的script名称
image.png 全部的生命周期钩子 参考

  • prepublish：在打包和发布包之前运行，在npm install没有任何参数的本地运行。
  • prepare：在打包和发布包之前运行，在本地npm install：没有任何参数，以及安装git依赖项时运行。这是在之后运行prepublish，但是之前prepublishOnly
  • prepublishOnly：仅在准备和打包之前运行npm publish。
  • prepack：前运行压缩包（npm pack，npm publish并安装git的依赖时）
  • postpack：在生成压缩包并移动到其最终目的地之后运行。
  • publish postpublish：发布包后运行
  • preinstall：包安装之前运行
  • install postinstall：包安装后运行。默认：node-gyp rebuild,如果binding.gyp包的根目录中有一个文件而您尚未定义自己的脚本install或preinstall脚本，npm将默认install使用node-gyp进行编译。
  • preuninstall uninstall：在包卸载之前运行。
  • postuninstall：在包卸载之后运行。
  • preversion：在碰撞包版本之前运行。
  • version：碰撞包版本之后，但提交之前运行。
  • postversion：碰撞包版本之后，提交之后运行。

6. 变量

可以通过使用node的环境变量npm_package_*获取packages.json中的字段
image.png
也可以设置config设置环境变量 使用npm_package_config_* 获取变量的值，
image.png
config中的参数可以通过代码进行修改 npm config set <``package_name``>:config_params 值

  1. // 神奇的是你通过命令修改属性的值,并没有任何提示 但是他确实是修改了
  2. // 副作用 虽然修改了 但是package.json中没有任何改变,关闭编辑器重新打开也还是显示修改后的值
  3. npm config set admin_pro:world '你好世界'

image.png