用Lerna管理多包JS項目

年後會開發一個很有挑戰性的項目,在這個項目進行之前,需要做一些技術上的前期準備。

首當其衝的就是項目的組織和管理。通常,我們在開發前端項目時都是單個包的,也就是只有一個package.json文件以及一個node_modules文件夾。單個包項目的優點不言而喻,簡單,可靠,便於管理。但是,當一個大的項目庫代碼量劇增之後,管理起來就是一件比較麻煩的事情,為了方便代碼的共享,就需要將代碼庫拆分成獨立的包。Lerna便是優化和管理JS多包項目的利器。

lerna的項目結構長這樣:

multi-packages/ package.json packages/ package-1/ package.json package-2/ package.json

packages文件夾就是用來承載多個項目的目錄。

lerna項目中最常用到的命令是lerna bootstrap和lerna publish。lerna bootstrap用於為所有項目安裝依賴,類似於npm i/yarn ; lerna publish用於提交對項目的更新。基於以上兩點,需要在項目中使用npm和git。

為了使用lerna,需要全局安裝lerna:

npm i -g lerna

yarn global add lerna

lerna安裝完成之後,就需要使用lerna 初始化項目,使用(在使用該命令前,應該已經使用git init初始化過該項目):

lerna init

這個時候lerna會在自動項目下生成packages文件夾和lerna.json文件,並在package.json文件中的devDependencies欄位中生成lerna對應的依賴信息。

使用lerna管理項目時,可以選擇兩種模式。默認的為固定模式(Fixed mode),當使用lerna init命令初始化項目時,就默認為固定模式,也可以使用 lerna init --independent 命令初始化項目,這個時候就為獨立模式(Independent mode)。固定模式中,packages下的所有包共用一個版本號(version),會自動將所有的包綁定到一個版本號上(該版本號也就是lerna.json中的version欄位),所以任意一個包發生了更新,這個共用的版本號就會發生改變。而獨立模式允許每一個包有一個獨立的版本號,在使用lerna publish命令時,可以為每個包單獨制定具體的操作,同時可以只更新某一個包的版本號。

然後這裡介紹一下lerna add 命令,其命令簽名是:

lerna add <package>[@version] [--dev]

該命令用於為packages文件夾下的package安裝依賴。該命令有許多的用法,通常說來有如下幾種,還是以前面的文件夾為例,其目錄結構如下:

multi-packages/ package.json packages/ package-1/ package.json package-2/ package.json

  1. lerna add babel , 該命令會在package-1和package-2下安裝babel
  2. lerna add react --scope=package-1 ,該命令會在package-1下安裝react
  3. lerna add package-2 --scope=package-1,該命令會在package-1下安裝package-2

從上面的三個實例看出,使用lerna add 可以指定為某一個或所有的包安裝依賴,依賴可以為外部(通過npm install的方式),也可以為內部(即packages文件夾下的包),同時當指定的內部依賴版本號跟目標版本號不匹配時,將使用npm install的方式來安裝外部依賴。

然後就是最重要的lerna publish了,用於發布更新,運行該命令會執行如下的步驟:

  1. 運行lerna updated來決定哪一個包需要被publish
  2. 如果有必要,將會更新lerna.json中的version
  3. 將所有更新過的的包中的package.json的version欄位更新
  4. 將所有更新過的包中的依賴更新
  5. 為新版本創建一個git commit或tag
  6. 將包publish到npm上

同時,該命令也有許多的參數,例如--skip-git 將不會創建git commit或tag,--skip-npm將不會把包publish到npm上。

lerna updated/lerna diff 對包是否發生過變更

lerna ls,顯示packages下的各個package的version

lerna clean 清理node_modules

lerna run 運行npm script,可以指定具體的package


推薦閱讀:

TAG:前端開發 | 前端架構 | 項目管理工具 |