前言
這篇文章主要記錄自己在項(xiàng)目中搭建好npm倉(cāng)庫(kù)后遇到的坑，并不是講如何搭建私有npm倉(cāng)庫(kù)
1、為什么要搭建私有npm倉(cāng)庫(kù)？
并非每一個(gè)公司都需要搭建私有npm倉(cāng)庫(kù)來(lái)管理代碼，這個(gè)要視公司需求而定，由于我司的產(chǎn)品面向的客戶很多，而不同的客戶對(duì)這個(gè)產(chǎn)品的功能要求不一，打個(gè)比方：我公司現(xiàn)在開(kāi)發(fā)了A,B,C三個(gè)模塊，而客戶一的產(chǎn)品只需要A,B模塊，客戶二的產(chǎn)品只需要A,C模塊，客戶C的產(chǎn)品只需要B,C模塊，客戶D的產(chǎn)品需要A,B,C模塊，這就是我司的場(chǎng)景。當(dāng)然你可以說(shuō)你選擇拷貝代碼就行了，何必搞這么麻煩，那么當(dāng)我沒(méi)說(shuō)，其實(shí)實(shí)現(xiàn)業(yè)務(wù)模塊的打包非常明顯的好處就是，我可以寫(xiě)一套腳本幫我下載產(chǎn)品所需要的包，然后組合在一起打包發(fā)布，就成了一個(gè)新的產(chǎn)品，這就是自動(dòng)化的好處。然后就是基于這個(gè)技術(shù)棧的項(xiàng)目可能有多個(gè)，所以有一些組件是可以共用的，所以我司計(jì)劃自己封裝一些市面上沒(méi)有的組件，然后組成一個(gè)組件庫(kù)，給公司的多個(gè)項(xiàng)目使用，然后公網(wǎng)上有的包就去公網(wǎng)上下載就行了
2、如何搭建私有npm倉(cāng)庫(kù)？
由于本文并不是介紹如何搭建私有npm倉(cāng)庫(kù)的文章，關(guān)于如何搭建私有npm倉(cāng)庫(kù)請(qǐng)?jiān)L問(wèn)該鏈接->如何搭建私有npm倉(cāng)庫(kù) ,關(guān)于如何搭建私有npm倉(cāng)庫(kù)，那篇文章已經(jīng)講解的非常清晰了，這里只提一點(diǎn)就是，私有npm倉(cāng)庫(kù)是可以配置代理的公有倉(cāng)庫(kù)地址的，解釋詳細(xì)點(diǎn)就是：你的私有倉(cāng)庫(kù)里沒(méi)有的npm包，它就會(huì)去你配置的代理地址找npm包。代理倉(cāng)庫(kù)的地址可以在 config.yaml配置文件 里面 uplinks:npmjs:url:http://registry.npm.taobao.org/ 進(jìn)行配置，詳細(xì)請(qǐng)參考上面的如何搭建私有npm倉(cāng)庫(kù)鏈接的文章
3、搭建好私有npm倉(cāng)庫(kù)后遇到什么坑？
我發(fā)現(xiàn)使用nrm切換到私有npm倉(cāng)庫(kù)對(duì)應(yīng)的源后，下載帶@ 符號(hào)的包都下載失敗，比如下載 @angular/core，就會(huì)下載失敗，這是為什么呢，查閱了一些資料，發(fā)現(xiàn)這其實(shí)是Sinopia自己的bug，bug產(chǎn)生的原因就是：sinopia在代理到npmjs.org公有庫(kù)時(shí)將@符號(hào)轉(zhuǎn)碼為%40，致使在公有庫(kù)中找不到對(duì)應(yīng)的包，返回404 ，簡(jiǎn)單點(diǎn)說(shuō)就是 @angular/core 代理請(qǐng)求的時(shí)候被轉(zhuǎn)換成了 %40angular/core，所以我們需要在代理請(qǐng)求發(fā)出之前將其轉(zhuǎn)回 @angular/core
4、如何解決？
修改sinopia源碼：修改位于sinopia/lib/up-storage.js文件第10行：將var encode = encodeURIComponen;，更改為：var encode = function(thing) {return encodeURIComponent(thing).replace(/^%40/, '@');}; ,這段代碼的含義就是將%40轉(zhuǎn)回@，于是就解決了不能下載帶有@符號(hào)的npm包的bug
