npm script指南

這篇文章我們將來學(xué)習(xí)一下 package.json 文件中的 script字段以及 npm 其他的知識，直接進(jìn)入正題。

npm 腳本是 package.json 中定義的一組內(nèi)置腳本和自定義腳本,它們的模板是提供一種簡單的命令來執(zhí)行重復(fù)或者復(fù)雜的任務(wù),例如:

• 啟動一個 react 項(xiàng)目;
• 使用 webpack 對項(xiàng)目進(jìn)行打包;
• 等等;

每個腳本命令都有一個生命周期,執(zhí)行前做些什么,執(zhí)行的時候做些什么,執(zhí)行完成之后做些什么,例如,在 script 字段中添加兩個腳本命令,它們分別是 prestart 和 poststart ,具體代碼如下:

  "scripts": {
    "prestart": "echo 我首先執(zhí)行",
    "start": "node index.js",
    "poststart": "echo 我最后執(zhí)行"
  },

在終端中執(zhí)行 npm start,然后再查看控制臺,會有以下輸出:

npm 還可以通過 npm_package_字段名稱 來獲取 package.json 中的信息,需要執(zhí)行 script 腳本,例如在 package.json 中有以下定義:

  "scripts": {
    "start": "node index.js"
  },

在 index.js 文件中有以下代碼:

console.log(process.env.npm_package_version);

在終端中執(zhí)行 npm start 之后,發(fā)現(xiàn) package.json 中的版本信息被輸出出來了。在這里是通過環(huán)境變量 process.env 拿到 package.json 的字段值。

你還可以在終端中執(zhí)行命令前添加更多的字段,例如:

 npm start moment supper

你可以使用 process.argv 來獲取傳進(jìn)來的參數(shù),通過打印會有以下輸出:

從數(shù)組第二個值開始便是我們額外傳入的參數(shù)。

有的項(xiàng)目在啟動時可能需要同時執(zhí)行多個任務(wù),多個任務(wù)的執(zhí)行順序決定了項(xiàng)目的表現(xiàn)。

串行執(zhí)行,要求前一個任務(wù)執(zhí)行成功以后才能執(zhí)行下一個任務(wù),使用 && 符號來連接,例如:

  "scripts": {
    "start": "node index.js && node test.js"
  },

在串行命令執(zhí)行中,只要有一個執(zhí)行失敗,則整個腳本結(jié)束,在下面的圖片中,第一個命令出錯,后面不會有任何輸出:

與上面整個執(zhí)行方式不同的是并行執(zhí)行,就是多個命令可以同時的評選執(zhí)行,使用 & 符號來連接:

  "scripts": {
    "start": "node index.js & node test.js"
  },

在這里,如果有其中一個報錯了,剩下的依然能正常執(zhí)行.具體效果如下所示:

package-lock.json

當(dāng)我們運(yùn)行 npm install 命令之后,會發(fā)現(xiàn)自動生成了一個新文件 package-lock.json,該文件當(dāng) npm 修改 node_modules 樹或者 package.json 文件時,該文件會自動修改,如果是手動修改會在下一次執(zhí)行 npm install 時進(jìn)行修改。

package-lock.json 文件旨在提交到代碼創(chuàng)庫中,例如 GitHub中,用于各種目的:

• 描述依賴關(guān)系樹的單一具體表示形式,以保證團(tuán)隊(duì)開發(fā)和部署時安裝完全相同的依賴關(guān)系;
• 為用戶提供一種 time-travel 到以前的狀態(tài)的工具,意思就是說你之前在 node_modules 中使用的版本是什么,當(dāng)你把 node_modules 文件刪除之后將代碼分享給別人,他們通過 npm install 下載到的包版本也是一致;
• 優(yōu)化安裝速度,如果存在的包,且版本相同則跳過,提高速度;

package-lock.json 的生成邏輯可以看下面的例子進(jìn)行講解,例如,在我們的項(xiàng)目 moment 中,安裝依賴包 X,依賴包 X 中依賴著包 Y,并且 Y 依賴 Z,具體依賴關(guān)系請看以下代碼:

// project moment
{ "name": "moment", "dependencies": { "X": "^1.0.0" }}
// package X
{ "name": "X", "version": "1.0.0", "dependencies": { "Y": "^1.0.0" }}
// package B
{ "name": "Y", "version": "1.0.0", "dependencies": { "Z": "^1.0.0" }}
// package Z
{ "name": "Z", "version": "1.0.0" }

在這種情況下 package-lock.json 文件會生成類似以下內(nèi)容:

// package-lock.json
{ 
    "name": "moment",  
    "version": "1.0.0",  
    "dependencies": {    
        "X": { "version": "1.0.0" },
        "Y": { "version": "1.0.0" },
        "Z": { "version": "1.0.0" }  
    }
}

在我們后面的開發(fā)中,如果我們不修改 package.json 文件,那么 package-lock.json 文件就永遠(yuǎn)都不會被重新生成,即使 X 包發(fā)布了新版本,雖然我們 package.json 文件中寫的是 ^1.0.0,但是因?yàn)?package-lock.json 文件的存在,執(zhí)行 npm install 并不會自動升級。

總的來說,package.json 文件是指定依賴包能使用的范圍,而 package-lock.json 文件是使用這個范圍中的一個具體值。

參考文章 package.json 與 package-lock.json 的關(guān)系

以上就是npm script和package-lock.json使用示例詳解的詳細(xì)內(nèi)容，更多關(guān)于npm script package-lock.json的資料請關(guān)注腳本之家其它相關(guān)文章！

最新評論