最近發現公司一個項目的目錄組織挺奇怪的,全部的子項目都放在了packages
目錄裏,還有這種騷操做?特地查了下資料,發現是一種比較流行的monorepo
項目管理模式。近幾年比較火的React,Vue,Babel都是用的這種模式:javascript
咱們日常通常採用的都是multiple repositories
的項目管理模式:把一個大項目拆分紅若干個小項目,每一個小項目都獨立的放在gitlab上。這種模式其實也沒啥很差,可是某些狀況下,子項目A依賴子項目B,若是子項目B常常改動,那麼每次B改動了,都要修改A,這時就很是麻煩。在開發一個前端框架或者UI庫時,就常常會遇到上述狀況,這時咱們就能夠考慮下monorepo
。前端
monorepo
說到底也只是一個理念,那麼怎麼才能實現這種代碼組織呢?java
本文主要介紹下lerna的使用node
源碼參考ios
全局安裝lernagit
npm i lerna -g
lerna是基於git的,在github上新建一個項目learn-lerna
github
git clone git@github.com:deepred5/learn-lerna.git cd learn-lerna
初始化項目:npm
lerna init
lerna會自動建立一個packages
目錄夾,咱們之後的項目都新建在這裏面。同時還會在根目錄新建一個lerna.json
配置文件json
{ "packages": [ "packages/*" ], "version": "0.0.0" // 共用的版本,由lerna管理 }
咱們建立兩個package:bootstrap
cd packages mkdir prpr-lerna-core cd prpr-lerna-core npm init -y
cd packages mkdir prpr-lerna-popular cd prpr-lerna-popular npm init -y
注意:這兩個package咱們最後都是要發佈到npm上的,因此名字請取特殊些,不能被人用過
prpr-lerna-popular
依賴prpr-lerna-core
,這時有兩種方法添加依賴:
第一種方法是修改prpr-lerna-popular/package.json
,添加
{ "dependencies": { "prpr-lerna-core": "^1.0.0" } }
而後運行lerna bootstrap
第二種方法是直接使用命令add
lerna add prpr-lerna-core --scope=prpr-lerna-popular
運行以後,咱們發現prpr-lerna-popular
生成了node_modules
,而node_modules
裏生成了指向prpr-lerna-core
的軟鏈,相似npm link
的效果:
新建prpr-lerna-core/index.js
const API = 'https://yande.re/post/popular_recent.json'; module.exports = { API }
prpr-lerna-popular
除了依賴prpr-lerna-core
,還能夠依賴其餘開源的庫,好比咱們使用axios
lerna add axios --scope=prpr-lerna-popular
新建prpr-lerna-popular/index.js
const { API } = require('prpr-lerna-core'); const axios = require('axios'); const getPopularImg = () => axios.get(API) module.exports = getPopularImg; // 測試代碼,發佈時刪除 getPopularImg().then((res) => console.log(res.data.length));
測試一下:node packages/prpr-lerna-popular/index.js
正常狀況下能夠輸出結果
首先把全部的代碼提交
cd learn-lerna git add . git commit -m "test publish"
註冊一個npmjs帳戶
npm login
登入你的帳戶,若是本地npm是淘寶鏡像,必定要換回https://registry.npmjs.org/
地址!!!
lerna publish
運行publish
,選擇發佈的版本號
lerna能夠幫咱們管理版本號,很是方便!
lerna init #初始化 lerna bootstrap #下載依賴包或者生成本地軟鏈接 lerna add axios #全部包都添加axios lerna add prpr-lerna-core --scope=prpr-lerna-popular #給包prpr-lerna-popularx添加prpr-lerna-core依賴 lerna list lerna clean
@
開頭的,例如@deepred/core
,npm默認覺得是私人發佈,須要使用npm publish --access public
發佈。可是lerna publish
不支持該參數,解決方法參考: issues