60%的人都不知道 package-lock.json 有啥用吧？簡單講講

前言

大家好，我是林三心，用最通俗易懂的話講最難的知識點是我的座右銘，基礎是進階的前提是我的初心。

背景

不知道大家平時在開發中有沒有注意到，你的專案中有兩個檔案：

• package.json
• package-lock.json

應該很多人平時都不會去關注這兩個檔案有啥關係吧！今天就給大家簡單地講講吧，這樣下次面試官問起時，大家也可以裝裝杯了~~

例子

背景

在 package.json 中， vue 的版本是 ^2.6.14 。

"vue": "^2.6.14",

^ 的意思是，假如過幾天Vue在大版本 2下更新了小版本 2.6.15 ，那麼當你 npm install 時Vue會自動升級為 2.6.15

引起的問題

比如現在有 程式設計師A、程式設計師B 兩個開發者

• 程式設計師A：接手專案時Vue的版本是 2.6.14 ，並一直使用這個版本
• 程式設計師B：一個月後加入這個專案，這時Vue已經升級到 2.9.14 了， npm install 的時候會自動升級

總結：這會導致兩個人開發時的Vue版本不同，從而會導致合作開發產生一些問題，以及錯誤。

package-lock.json

package-lock.json 可以解決以上的問題，他的作用就是：鎖定安裝模組的版本號

比如現在有 程式設計師A、程式設計師B 兩個開發者

• 程式設計師A：接手專案時Vue的版本是 2.6.14 ，此版本被鎖在了 package-lock.json
• 程式設計師B：一個月後加入這個專案，這時Vue已經升級到 2.9.14 ， npm install 的時候，按理說會自動升級，但是由於 package-lock.json 中鎖著 2.6.14 這個版本，所以阻止了自動升級，保證版本還是 2.6.14

結語

我是林三心，一個熱心的前端菜鳥程式設計師。如果你上進，喜歡前端，想學習前端，那我們們可以交朋友，一起摸魚哈哈，摸魚群，加我請備註【思否】