cnpm+gitlab-ci 模塊自動發佈方案

爲何會探討這個主題

在我司現有web前端項目構建過程當中，一直使用gulp + rjs的方案進行項目打包，因爲整站項目過於龐大，即便是以至關好的機器多核打包，也須要4分鐘+的時間，遂產生了將模塊所有使用npm管理，並拆分子項目，達到每一個通用模塊均可自動構建，單元測試，保證質量並穩步迭代的目的。

項目其他細節

公司內部內容，略過

cnpm與cnpmjs.org的部署

cnpm原理

爲npm原有的一些命令設置了代理，讓你能夠方便的鏈接到本身的私有服務，並同時使用npm上的資源包，您能夠選擇使用命令直接同步npm官方包（實質是向您的cnpmjs.org私有服務發送命令，並同步線上資源，存儲下來），也能夠直接經過cnpm接洽的原生npm直接下載，取決於您的需求

部署

cnpm官方經過開源項目cnpmjs.org整合了cnpm.registry和cnpm.web兩個服務，讓用戶能夠經過cnpm指定registry使用私有服務。

這裏只介紹使用sqlite3做爲存儲私有包的記錄數據庫，即官方wiki中的5分鐘部署cnpmjs。

Deploy-a-private-npm-registry-in-5-minutes

直接根據以上連接闡述內容，您能夠馬上配置起一個cnpmjs.org服務.

配置cnpmjs.org

值得注意的是，您若是沒有配置雲存儲服務器，將會默認使用fs-cnpm的配置，默認將publish的包存放在~/.cnpmjs.org/downloads下

默認的sqlite數據庫位於~/.cnpmjs.org/data.sqlite

cnpmjs.org相關配置位於cnpmjs.org的包的config/index.js中

注意：bindingHost默認爲127.0.0.1，請置空字符串或已註冊的具名地址或內網可訪問的ip地址，以便在內網其餘機器上訪問該服務

若是需使用其餘雲存儲配置，已有數據庫，請按照官方wiki修改相應配置。

---

# 後臺啓動cnpmjs.org服務，若有須要，可以使用其餘守護進程
nohup cnpmjs.org start --admins='myname,othername' \
  --scopes='@my-company-name,@other-name' &

當安裝好cnpmjs.org並配置好後，須要使用命令寫入或者直接配置(至少運行一次)私有倉庫做用域(scopes)以及私有倉庫管理員名稱。不明白的能夠去npm官方文檔瞭解一下

cnpmjs.org的registry服務和web服務默認位於7001,7002兩個端口，7002便是cnpmjs.org的web網頁，能夠查看發佈的相關私有包或同步的包

配置cnpm

cnpm set registry http://bindingHost:7001

將registry服務地址設置爲你啓動的cnpmjs.org registry服務地址

---

第一次登陸

也就是註冊。

緣由是調用cnpm login的時候，走到cnpmjs.org服務,會經過如下路由

app.put('/-/user/org.couchdb.user::name', addUser);

輸入下面內容開始建立

cnpm login myname

測試私有npm是否暢通

新建一個項目，cnpm init之

name設置爲'@my-company-name/test'

cnpm publish嘗試，上傳成功

數據備份

相應包若是因爲宕機或其餘緣由消失了是一件很麻煩的事情，請定時去默認數據存儲文件夾備份一份（若是使用了其餘已有的數據庫，雲存儲，請自行備份），以便恢復。

gitlab的部署

這裏使用的是ce-11.0.3版本，按照官方傻瓜式部署,直接能夠部署上

請區分ce和ee兩個不一樣版本

EXTERNAL_URL配置與上步驟配置bindingHost相似

其他郵件配置，其餘數據庫配置（如不用默認數據庫）,以及其餘配置,請自行搜索或尋找官方文檔。

gitlab首次啓動

使用10 11等版本，首次啓動的默認管理員用戶密碼再也不如同之前同樣是root 5iveL!fe了，

在新版本中，gitlab-rails web服務於auth中間件中判斷了用戶是否爲第一次登錄，若是爲第一次登錄，將會跳轉到修改密碼頁，只需簡單進入佈置好的網頁服務設置root密碼便可。

gitlab首次進入修改不了密碼？

。。。雖然我是個低級前端工程師，而且我chrome打開了f12,可是我沒看到報錯，查看了各類權限是否分配錯誤，查看了是否是編譯出錯，查看了web服務的auth中間件以及 changepassword服務，查看了數據庫，各類可能都找了一遍，就差沒直接改數據庫，沒找到緣由。。。

而後我看到了這篇文章修改GitLab Web服務默認端口和初次登陸密碼報錯問題

嘗試換了個瀏覽器，好了。。。沒有繼續深究爲何

安裝gitlab-runner

請直接參考官方文檔 在任意一臺機器上無腦安裝便可

配置gitlab-runner

也請直接參考官方文檔

或參考個人渣文檔最底部的資料連接

重頭戲

gitlab-ci cnpm配合作到一鍵發佈。

gitlab-ci cnpm配合前情提要

首先，用戶須要保證runner機器上也裝了cnpm，至於怎麼裝就隨便了。

cnpm登陸後並不會直接頒佈給你一個_authtoken,因此想直接經過在gitlab中的ci配置裏寫入_authtoken私密變量並進行私有包的發佈是不現實的。

cnpm的源碼中將publish命令直接拿給原生npm執行了，本身只是對參數進行了一些包裝，最終執行 npm publish argv命令

cnpm能夠作到的就是修改配置路徑（--userconfig參數配置項），讀取用戶cnpmrc配置。

在設置了--userconfig路徑之後，cnpm會將一系列參數直接傳遞給npm , npm經過 core包中的Conf模塊會將你的config文件解析掉，生成一個token並執行publish的put操做。

基於這點咱們就能夠作到測試完畢而且自動發佈私有包了

具體實施步驟

若是您沒有修改過指定的.cnpmrc客戶配置，當您登錄過cnpm後，會在用戶目錄下，也就是~/下發現.cnpmrc配置文件。

他大概是這樣的

registry=http://yourbindingRegistryServerHost
//yourbindingHost:always-auth=false
//yourbindingRegistryServiceHost:_password=加密過的密碼串
//yourbindingRegistryServiceHost:username=myname
//yourbindingRegistryServiceHost:email=myname@localhost.com

那麼思路就很明白了，咱們能夠這樣寫咱們的發佈腳本腳本

// publish.js
const fs = require('fs');
const argv = process.argv;
const un = argv[2];
const pw = argv[3];
const em = argv[4];
const r = argv[5];
const exec = require('child_process').exec;

if (un && pw && em && r) {
    const or = r.replace(/^https?:/, '')
    const result = `
registry=${r}
${or}:always-auth=false
${or}:_password=${pw}
${or}:username=${un}
${or}:email=${em}
`;
    fs.writeFileSync('./.cnpmrc', result);
    exec('cnpm publish --userconfig=' + process.cwd() + '/.cnpmrc', (error, stdout, stderr) => {
        console.log(`stdout: ${stdout}`);
        console.log(`stderr: ${stderr}`);
        if (error) {
            console.error(`exec error: ${error}`);
            process.exit(1);
        }
    })
}

這樣寫咱們的ci配置

before_script:
  - npm i
stages:
  - test
  - publish
job1:
  stage: test
  script:
    - npm run test
  only:
    - master
  tags:
    - qie
job2:
  stage: publish
  script:
    - 'node ./publish.js $CNPM_UN $CNPM_PW $CNPM_EM $CNPM_R'

$CNPM\_UN $CNPM_PW $CNPM\_EM $CNPM_R爲在gitlab倉庫中設置的CI私密變量

效果

結語

善