解決npm安裝依賴和package.json定義版本不一致
前言
2021年搭了項目的腳手架(fd),春節前cnpm install的時候還可以啟動,但是春節后,重新cnpm install,發現項目啟動報錯了。奇怪,項目代碼和之前一樣,一點都沒改動。 難道是新型冠狀病毒感染了?
1. 代碼分析定位原因 ,less 代碼報錯
折騰了很長時間時間,刪除代碼對比,然后最終定位工程結構中此行代碼導致了報錯
```
<style lang="less">
@import "./css/index.less";
</style>
```
2. less 分析
package.json 。 less版本為3.9.0, 但是找到 node_modules中的less 版本為 3.11.1
是不是很奇怪?
竟然不是我們定義的版本, 查找之前的項目,同樣找到 node_modules目錄中的less, 此處的版本無任何問題,
將原來的項目的中依賴,復制到現在的項目,項目照常啟動。
到此圓滿解決問題。
3. 結論
npm或者cnpm 安裝依賴,不會完全按照package.json中的版本號來,會有稍微的差異,這樣的差異可能導致項目起不來,或者報錯, 因為某些包只有特定的版本才能正常運行。
4. 解決根源
上述問題根源其實是到底就是如何讓依賴的安裝和 package.json中定義的一樣。
經過一番查找,解決此問題有以下方案。
1. npm提供了shrinkwrap命令來解決這個問題。 在項目所有依賴都安裝完后,項目可正常穩定運行時,再運行如下命令:
npm shrinkwrap
此時會生成一個 npm-shrinkwrap.json 文件, 此文件會鎖定所有的依賴來源, 后期再執行 cnpm install 或者 npm install 都不會出錯,包的版本會和 package.json 中定義的一樣。
注意: 如果之后安裝了其他包, npm-shrinkwrap.json 文件 不會自動更新,所以需要再次執行 npm shrinkwrap
2. 將node版本升級到 10+, npm 升級到 6+ , 在執行 npm install 操作時, node會動態生成 package-lock.json, 這樣其他人再用 npm安裝時,包的版本會和 package-lock.json 中定義的一樣。
注意: 采用cnpm 安裝依賴會忽略 package-lock.json , 所以建議將 npm 的地址直接指向taobao鏡像, npm 可以采用 nrm管理。
親測:
上述版本不會自動生成 package-lock.json 。
升級到以下版本可以
3. 采用 yarn 安裝依賴, 此操作未測試, yarn 初次安裝速度相比淘寶 太慢! 各位可以自行測試!