也許你不知道的npm-scripts

前言

昨天發了一篇文章《記一次gitHook帶來的思考🤔》，發現npm在install和uninstall的時候能夠執行腳本，@羽葉丶大佬評論說，能夠繼續思考下 爲什麼裝包時能夠運行腳本命令。因而乎今天就去看了一下昨天的主角yorkie，再它的package.json中發現了線索

{
  "scripts": {
    "install": "node bin/install.js",
    "uninstall": "node bin/uninstall.js"
  }
}
複製代碼

開始思考

scripts咱們應該都知道，能夠使用npm run xxx來幫助咱們完成一些事情。從昨天的發現到今天的探索來看，scripts頗有可能還充當着生命週期的角色。開始查閱npm-scripts文檔，看到的結果大吃一驚。原來咱們熟知和常常使用的npm run xxx在文檔中成爲"另外，能夠經過這種方式執行任意腳本"。下面看一下也許你不知道的npm-scripts:

scripts的屬性

生命週期scripts

• 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：碰撞包版本以後，提交以後運行。

主動調用

• pretest test posttest：由npm test命令運行。
• prestop stop poststop：由npm stop命令運行。
• prestart start poststart：由npm start命令運行。默認：node server.js
• prerestart restart postrestart：按npm restart命令運行。注意：npm restart 若是沒有restart提供腳本，將運行中止和啓動腳本。 -preshrinkwrap shrinkwrap postshrinkwrap：由npm shrinkwrap命令運行。

其餘發現

神祕的.bin

你可能發現有這樣一個目錄node_modules/.bin，在裏面有webpack vue-cli-service這些常見的文件，爲何會有呢？跟上面所說的scripts有必定關係

運行npm start來執行腳本，在npm install時，腳本會導出到node_modules/.bin目錄中。

好比node_modules/.bin中存在腳本vue-cli-service

{
  "scripts": {
    "serve": "vue-cli-service serve --open",
  }
}
複製代碼

package變量

好比 package.json中存在

{
  "name": "test"
}

process.env.npm_package_name // 值爲test
複製代碼

說到這，想到一個問題，yorkie要求咱們在package.json中填寫gitHooks字段，是否是經過這種方式獲取的呢？看了一下源碼並非。

const pkg = fs.readFileSync(path.join(cwd, 'package.json'))
const hooks = JSON.parse(pkg).gitHooks
複製代碼

鉤子腳本

git擁有鉤子腳本目錄爲.git/hooks，npm也有鉤子腳本node_modules/.hooks/{eventname}其中evenname是scripts字段中的。在這定義的hook將會運用到項目中全部的包。

最後的話

但願你們多多指教，有什麼問題歡迎評論區見，在接受批評中共同成長，共同進步。

參考資料

• yorkie倉庫
• npm官方文檔(npm-scripts)