原文作者：Fernando Doglio

原文地址：https://itnext.io/the-3-best-monorepo-tools-for-2023-290bd4be8f0b

(資料圖片僅供參考)

翻譯：一川

如果沒有正確的工具集，管理monorepos通常是一項(xiàng)具有挑戰(zhàn)性的任務(wù)。

在單個(gè)存儲(chǔ)庫(kù)中協(xié)調(diào)多個(gè)項(xiàng)目的復(fù)雜性可能會(huì)導(dǎo)致以下問題：

開發(fā)人員的困惑和維護(hù)難題。不需要的組件的耦合。發(fā)展團(tuán)隊(duì)和項(xiàng)目的復(fù)雜性。部署難題。難以單獨(dú)對(duì)組件進(jìn)行版本控制，允許它們僅在需要時(shí)部署它們。

幸運(yùn)的是，有一些工具可以簡(jiǎn)化單存儲(chǔ)庫(kù)的管理并增強(qiáng)開發(fā)體驗(yàn)。

在本文中，我們將探討開發(fā)人員可以用來有效處理monorepos的前三個(gè)工具。每個(gè)工具都為常見的單存儲(chǔ)庫(kù)問題提供獨(dú)特的功能和解決方案。讓我們深入了解這些工具如何簡(jiǎn)化您的monorepo管理流程。

RushJS

訪問地址：https://rushjs.io/

RushJS是一個(gè)強(qiáng)大的工具，專門設(shè)計(jì)用于簡(jiǎn)化monorepos的管理。它提供了一組正確的功能和命令，使開發(fā)人員能夠有效地處理與在單個(gè)存儲(chǔ)庫(kù)中處理多個(gè)項(xiàng)目相關(guān)的挑戰(zhàn)。

通過提供高效的依賴關(guān)系管理、優(yōu)化的構(gòu)建、增強(qiáng)的可擴(kuò)展性和改進(jìn)的開發(fā)人員體驗(yàn)，RushJS使團(tuán)隊(duì)能夠輕松駕馭monorepo開發(fā)的復(fù)雜性。

最重要的是，RushJS是由Microsoft構(gòu)建的，這在當(dāng)今往往意味著什么。因此，讓我們來看看如何使用它來解決我們的Monorepo頭痛問題。

安裝 RushJS

要安裝RushJS，您所要做的就是使用NPM：

npm install -g @microsoft/rush

然后只需在當(dāng)前項(xiàng)目的文件夾上運(yùn)行rush init即可開始工作。

RushJS的基本用途

正確安裝和配置RushJS后，讓我們快速回顧一下如何在日常工作中使用它。

使用Rush，您需要記住兩個(gè)命令：rush和rushx。您將用于rush所有monorepo級(jí)別的操作，例如更新所有依賴項(xiàng) （rush update） 或使用 構(gòu)建rush rebuild整個(gè)項(xiàng)目列表。

然后，您將用于rushx特定于項(xiàng)目的命令。例如，使用rush rebuild構(gòu)建一個(gè)項(xiàng)目后啟動(dòng)該項(xiàng)目，您可以使用：

cd my-projectmy-project> rushx start

理解RushJS的關(guān)鍵是它是為JavaScriptmonorepos設(shè)計(jì)的?？雌饋砟銜?huì)通過在存儲(chǔ)庫(kù)的根部放置大量package.json內(nèi)容來做同樣的事情，但Rush并非如此。相反，它使用一組符號(hào)鏈接來保持所有項(xiàng)目的更新并同時(shí)分開。

如果你正在構(gòu)建一個(gè)JavaScript項(xiàng)目，在其中開發(fā)大量單獨(dú)的npm包，使用RushJS絕對(duì)是一個(gè)值得的選擇。

Turborepo

Turborepo是一個(gè)強(qiáng)大的工具，專門設(shè)計(jì)用于簡(jiǎn)化monorepos的管理。它提供了一系列特性和功能，可幫助開發(fā)人員克服與在單個(gè)存儲(chǔ)庫(kù)中處理多個(gè)項(xiàng)目相關(guān)的挑戰(zhàn)。通過提供高效的項(xiàng)目組織、增強(qiáng)的開發(fā)工作流程和優(yōu)化的構(gòu)建，Turborepo使團(tuán)隊(duì)能夠有效地處理單存儲(chǔ)庫(kù)的復(fù)雜性。

Turborepo的關(guān)鍵在于它的名字，更準(zhǔn)確地說是“turbo”部分。該工具的主要賣點(diǎn)是它使您的工作流程運(yùn)行得更快。它通過將緩存添加到過程中來實(shí)現(xiàn)。源代碼文件將充當(dāng)哈希函數(shù)的輸入，輸出將是日志文件和stderr輸出。

也就是說，如果在只有少數(shù)文件發(fā)生更改的情況下運(yùn)行構(gòu)建或測(cè)試運(yùn)行，則該過程將只關(guān)注它們，其余文件將從緩存中獲取。

在實(shí)踐中，這意味著構(gòu)建速度非?？?，尤其是一旦項(xiàng)目順利進(jìn)行并且您只是在推動(dòng)微小的更改或新功能。

安裝Turborepo

訪問地址：https://turbo.build/repo

安裝Turborepo非常簡(jiǎn)單，您所要做的就是使用npm（劇透警報(bào)，您還將在下一個(gè)工具中使用NPM）：

npm install turbo -g

然后，您可以簡(jiǎn)單地進(jìn)入monorepo中的項(xiàng)目文件夾，并運(yùn)行如下命令：

cd monorepo/project1turbo build

或者，如果您已經(jīng)有一個(gè)項(xiàng)目并且想要向其添加Turborepo，請(qǐng)?jiān)诟?jí)別創(chuàng)建一個(gè)turbo.json文件。對(duì)于NextJS項(xiàng)目，請(qǐng)使用如下配置：

{  "$schema": "https://turbo.build/schema.json",  "pipeline": {    "build": {      "outputs": [".next/**", "!.next/cache/**"]    },    "lint": {}  }}

查看他們的文檔[https://turbo.build/repo/docs/getting-started/add-to-project]，了解如何為其他框架配置它。

Turborepo的基本使用方法

正確安裝和配置Turborepo后，讓我們探索它在monorepo環(huán)境中的基本用法：

項(xiàng)目組織

Turborepo提供了在monorepo中組織項(xiàng)目的有效方法。它允許您定義項(xiàng)目邊界、管理共享依賴項(xiàng)以及維護(hù)不同項(xiàng)目之間的明確分離。使用Turborepo，您可以在monorepo中創(chuàng)建單獨(dú)的項(xiàng)目目錄，并指定每個(gè)項(xiàng)目所需的依賴項(xiàng)。這實(shí)現(xiàn)了模塊化和可擴(kuò)展的結(jié)構(gòu)，從而可以更輕松地管理和維護(hù)代碼庫(kù)。Turborepo還提供用于添加、刪除和更新項(xiàng)目的命令，確保在monorepo中進(jìn)行簡(jiǎn)單的項(xiàng)目管理。

簡(jiǎn)化的開發(fā)工作流程

Turborepo簡(jiǎn)化了開發(fā)工作流程，可以更輕松地同時(shí)處理多個(gè)項(xiàng)目。它引入了智能緩存等功能，其中利用以前構(gòu)建的工件來減少構(gòu)建時(shí)間。通過智能跟蹤更改和重用構(gòu)建的工件，Turborepo消除了冗余構(gòu)建，節(jié)省了寶貴的開發(fā)時(shí)間。開發(fā)人員可以通過使用命令turbo build來利用緩存機(jī)制，例如僅生成受代碼更改影響的必要組件。這種優(yōu)化提高了開發(fā)速度，尤其是在處理具有互連項(xiàng)目的大型單存儲(chǔ)庫(kù)時(shí)。

依賴關(guān)系管理

Turborepo簡(jiǎn)化了單存儲(chǔ)庫(kù)中依賴關(guān)系的管理。它提供了一種跨項(xiàng)目處理依賴項(xiàng)的統(tǒng)一方法，確保一致且高效的解決方案。Turborepo利用共享依賴項(xiàng)模型，允許您聲明可在多個(gè)項(xiàng)目之間共享的公共依賴項(xiàng)。這消除了跨項(xiàng)目重復(fù)依賴項(xiàng)的需要，從而降低了版本沖突的風(fēng)險(xiǎn)并確保了一致性。Turborepo智能地解析依賴關(guān)系，確保為monorepo中的每個(gè)項(xiàng)目安裝正確的版本。

優(yōu)化構(gòu)建

Turborepo通過智能識(shí)別和僅構(gòu)建受代碼更改影響的必要組件來優(yōu)化構(gòu)建過程。這種增量構(gòu)建機(jī)制顯著縮短了構(gòu)建時(shí)間，使開發(fā)人員能夠更快地迭代。Turborepo跟蹤單存儲(chǔ)庫(kù)中的更改并執(zhí)行選擇性構(gòu)建，僅重建受代碼修改影響的項(xiàng)目或組件。這種精細(xì)的方法最大限度地減少了構(gòu)建開銷，并確保開發(fā)人員可以專注于他們正在處理的代碼庫(kù)的特定部分。通過利用優(yōu)化的構(gòu)建，開發(fā)人員可以加快開發(fā)周期并提高生產(chǎn)力。

協(xié)作和版本控制

Turborepo提供的功能可促進(jìn)單存儲(chǔ)庫(kù)設(shè)置中的協(xié)作和版本控制。它支持項(xiàng)目之間的高效代碼共享，允許團(tuán)隊(duì)在保持明確邊界的同時(shí)處理共享組件。Turborepo通過提供用于在monorepo中創(chuàng)建分支、合并更改和解決沖突的命令來實(shí)現(xiàn)協(xié)作開發(fā)。它還與Git等版本控制系統(tǒng)很好地集成，確保有效管理更改和版本歷史記錄。借助Turborepo，團(tuán)隊(duì)可以無(wú)縫協(xié)作，增強(qiáng)協(xié)作并在monorepo中實(shí)現(xiàn)高效的版本控制。

通過利用Turborepo的基本使用功能，開發(fā)人員可以簡(jiǎn)化其monorepo工作流程、提高開發(fā)速度并保持代碼質(zhì)量。其直觀的命令和優(yōu)化的流程使其成為有效管理monorepos、促進(jìn)無(wú)縫協(xié)作和提高整體生產(chǎn)力的寶貴工具。

bit

訪問地址：https://bit.dev/

Bit實(shí)際上不是一個(gè)單存儲(chǔ)庫(kù)管理工具，但它提供了如此出色的體驗(yàn)，以至于它可以通過它提供的新工作流程解決所有Monorepo“困難”。

管理monorepos的主要挑戰(zhàn)之一是保持代碼模塊化，同時(shí)確保高效的協(xié)作和代碼重用。Bit通過組件驅(qū)動(dòng)開發(fā)（CDD）正面解決了這一挑戰(zhàn)。

CDD將組件置于開發(fā)過程的中心。開發(fā)人員不是從項(xiàng)目或文件的角度來思考，而是專注于創(chuàng)建自包含的、可重用的組件。組件表示可在monorepo中的多個(gè)項(xiàng)目中使用的特定功能、UI 元素或邏輯。通過采用以組件為中心的方法，Bit提高了代碼模塊化和可重用性。

安裝Bit

安裝Bit就像編寫一樣簡(jiǎn)單：

npx @teambit/bvm install

如果您想要更多安裝選項(xiàng)，可以查看他們的文檔站點(diǎn)[https://bit.dev/docs/getting-started/installing-bit/installing-bit/]。

安裝后，您可以通過以下方式開始在項(xiàng)目中使用它：

bit init

然后，您可以開始創(chuàng)建工作區(qū)，這是一個(gè)花哨的詞，表示您將在其中添加組件的文件夾。

每個(gè)組件都是使用 Bit創(chuàng)建的，這有助于“正確”設(shè)置所有內(nèi)容：

它們將在不同的文件夾中獨(dú)立管理。他們將在代碼文件旁邊創(chuàng)建測(cè)試和文檔模板。您將能夠單獨(dú)對(duì)它們進(jìn)行版本控制。這反過來又使發(fā)布它們和重用它們變得非常簡(jiǎn)單。Bit 的基本用法

理解為什么Bit是monorepos的絕佳選擇的關(guān)鍵，即使它不是特定于monorepo的工具，因?yàn)樗峁┑腄X（開發(fā)人員體驗(yàn)）與對(duì)組件驅(qū)動(dòng)開發(fā)的支持相結(jié)合。

讓我解釋一下。

使用 Bit，您將不會(huì)擁有monorepo，但您會(huì)覺得您正在使用實(shí)際的monorepo。

我知道一開始很難理解，所以讓我舉個(gè)例子。

假設(shè)一個(gè)由多個(gè) UI 組件（如按鈕、輸入字段和卡片）組成的項(xiàng)目。傳統(tǒng)上，在monorepo設(shè)置中，所有這些組件將駐留在單個(gè)存儲(chǔ)庫(kù)中，從而導(dǎo)致大型而復(fù)雜的代碼庫(kù)。但是，使用 Bit，開發(fā)人員可以將這些組件分解為單獨(dú)的實(shí)體，每個(gè)實(shí)體都有自己的開發(fā)生命周期。

通過這個(gè)詳細(xì)的教程[https://bit.dev/blog/how-to-create-a-composable-react-app-with-bit-l7ejpfhc/]了解如何在 React通過bit創(chuàng)建可組合的應(yīng)用程序，了解如何做到這一點(diǎn)。

初始化組件

首先，開發(fā)人員可以使用Bit的命令行界面（CLI）將每個(gè)組件初始化為單獨(dú)的實(shí)體。例如，他們可以對(duì)按鈕組件運(yùn)行以下命令：

bit create react components/button

此命令初始化項(xiàng)目中的按鈕組件，創(chuàng)建專用目錄（如components/button），并設(shè)置特定于按鈕組件的必要文件和依賴項(xiàng)。

這意味著您的node_modules文件夾將有一個(gè)指向新組件文件夾的新符號(hào)鏈接，這使得從monorepo代碼中的任何位置導(dǎo)入和使用它變得非常簡(jiǎn)單。

獨(dú)立開發(fā)組件

使用Bit，開發(fā)人員可以獨(dú)立處理每個(gè)組件，就像它是一個(gè)獨(dú)立的項(xiàng)目一樣。他們可以專門針對(duì)組件進(jìn)行更改、添加功能和運(yùn)行測(cè)試，而不會(huì)影響其他button組件或整個(gè)項(xiàng)目。例如，您可以將其代碼更改為如下所示：

// components/button/Button.jsimport React from "react";const Button = ({ label }) => {  return {label};};export default Button;

開發(fā)人員可以迭代地優(yōu)化和改進(jìn)組件，編寫特定于button組件的測(cè)試和文檔。Bit使開發(fā)人員能夠?qū)Ｗ⒂诟鱾€(gè)組件及其功能，同時(shí)保持清晰的分離和模塊化。

共享和重用組件

Bit的強(qiáng)大方面之一是能夠跨不同的項(xiàng)目或存儲(chǔ)庫(kù)共享和重用組件。開發(fā)人員可以使用以下命令將組件發(fā)布到共享button組件庫(kù)：

bit export components/button

（當(dāng)然，您必須首先運(yùn)行才能對(duì)bit tag組件進(jìn)行版本控制）。

此命令發(fā)布button組件，使其可供其他開發(fā)人員導(dǎo)入并在自己的項(xiàng)目中使用。

這有效地將單個(gè)組件的代碼推送到外部存儲(chǔ)庫(kù)（來自Bit）中，這在理論上打破了整個(gè)monorepo概念。但是，作為開發(fā)人員，這對(duì)您來說是完全透明的，這是最好的部分。

其他開發(fā)人員可以通過簡(jiǎn)單的導(dǎo)入語(yǔ)句安裝和使用該button組件：

import Button from "@my-company/button";

盡管在傳統(tǒng)的monorepo結(jié)構(gòu)中沒有所有組件，但開發(fā)人員可以無(wú)縫地導(dǎo)入和使用組件，就好像它們是monorepo的一部分一樣。Bit負(fù)責(zé)管理依賴關(guān)系并確保版本一致性，為開發(fā)人員提供類似monorepo的體驗(yàn)。

增強(qiáng)的代碼模塊化

使用 Bit的CDD方法，您可以將monorepo分解為單獨(dú)的獨(dú)立組件。這些組件封裝了特定的功能或 UI 元素，從而實(shí)現(xiàn)了更加模塊化的代碼庫(kù)。通過促進(jìn)代碼模塊化，Bit幫助開發(fā)人員創(chuàng)建可重用的組件，這些組件可以在monorepo中的不同項(xiàng)目之間輕松共享和集成。

隔離和獨(dú)立開發(fā)

Bit 使開發(fā)人員能夠獨(dú)立處理組件。每個(gè)組件都可以有自己的開發(fā)環(huán)境，從而更容易專注于特定的特性或功能。這種隔離降低了意外副作用的風(fēng)險(xiǎn)，并使測(cè)試和調(diào)試更加高效。借助 Bit，您可以獨(dú)立開發(fā)、測(cè)試和迭代組件，從而加快開發(fā)過程并提高代碼質(zhì)量。

無(wú)縫協(xié)作

Bit 通過提供用于共享和重用組件的集中式中心（Bit.cloud），簡(jiǎn)化了處理monorepo的開發(fā)人員之間的協(xié)作。使用 Bit的CDD，開發(fā)人員可以將組件發(fā)布到共享組件庫(kù)或Bit 注冊(cè)表。這使其他開發(fā)人員可以輕松地在自己的項(xiàng)目中發(fā)現(xiàn)、導(dǎo)入和使用這些組件。Bit的內(nèi)置版本控制確保組件可以在monorepo之間更新和共享而不會(huì)發(fā)生沖突。了解更多信息。

高效的文檔和測(cè)試

Bit的CDD方法鼓勵(lì)開發(fā)人員將組件作為單獨(dú)的實(shí)體進(jìn)行文檔和測(cè)試。文檔和測(cè)試與每個(gè)組件緊密集成，使開發(fā)人員更容易理解其用途、API 和用法。Bit 允許您獨(dú)立生成文檔并為每個(gè)組件運(yùn)行測(cè)試，從而確保代碼庫(kù)的質(zhì)量和可靠性。這種以文檔為中心的方法提高了代碼的可維護(hù)性，并促進(jìn)了開發(fā)團(tuán)隊(duì)內(nèi)的知識(shí)共享。如果您想了解有關(guān)為 Bit 組件編寫文檔的更多信息，請(qǐng)查看其文檔中的此頁(yè)面。

事實(shí)上，如果你看一下Bit.cloud上的組件，你會(huì)得到這樣的東西。

圖片

在那里，您可以獲得很多信息，例如有關(guān)組件的基本統(tǒng)計(jì)信息，以及您可以修改的實(shí)時(shí)代碼示例。它還具有渲染Markdown的能力，因此您可以使用它解釋所需的一切。

粒度版本控制和依賴項(xiàng)管理

Bit支持對(duì)monorepo中的組件進(jìn)行精細(xì)版本控制。每個(gè)組件都可以有自己的版本，從而可以精確控制更新和依賴項(xiàng)。Bit 自動(dòng)處理組件依賴項(xiàng)的解析，確?？珥?xiàng)目使用正確的版本。這消除了版本沖突并簡(jiǎn)化了monorepo中的依賴項(xiàng)管理。

要了解更多信息，請(qǐng)閱讀本文[https://bit.dev/blog/painless-monorepo-dependency-management-with-bit-l4f9fzyw/]。

或者，您可以查看此視頻：https://youtu.be/Z2kPUlLynzU

總之，Bit解決了monorepos帶來的所有問題，并增加了一些其他好處。正如您所看到的，上面的列表涵蓋了monorepo方法可能具有的所有“但是”。

請(qǐng)記住，對(duì)于Bit，您只會(huì)認(rèn)為您正在處理Monorepo，但是在幕后，您并非如此。

如果您考慮將 Bit 添加到現(xiàn)有和已建立的單存儲(chǔ)庫(kù)中的場(chǎng)景，這將特別有趣。您將使用 Bit 單獨(dú)提取每個(gè)組件，記錄它們，對(duì)它們進(jìn)行版本控制并在Bit.cloud的幫助下共享它們。有效地將單存儲(chǔ)庫(kù)分解為單個(gè)組件大小的存儲(chǔ)庫(kù)。但所有這些都會(huì)發(fā)生，你甚至不關(guān)心它。

寫在最后

使用正確的工具集，管理monorepos變得更加易于管理和愉快。Bit的組件驅(qū)動(dòng)開發(fā)（CDD）方法將代碼庫(kù)分解為可重用的組件，促進(jìn)模塊化，獨(dú)立開發(fā)，協(xié)作和高效的依賴關(guān)系管理。

Turborepo提供性能優(yōu)化，如并行構(gòu)建和增量測(cè)試，簡(jiǎn)化大規(guī)模項(xiàng)目開發(fā)。RushJS為單存儲(chǔ)庫(kù)管理提供了一個(gè)全面的工具包，確保一致的項(xiàng)目結(jié)構(gòu)，版本兼容性和高效的依賴關(guān)系處理。借助這些工具，開發(fā)人員可以有效地應(yīng)對(duì)monorepo挑戰(zhàn)，從而提高生產(chǎn)力和代碼質(zhì)量。

通過利用Bit，Turborepo或RushJS，您也可以簡(jiǎn)化工作流程。無(wú)論是Bit以組件為中心的方法，Turborepo的性能優(yōu)化，還是RushJS的綜合工具包，每個(gè)工具都帶來了獨(dú)特的功能和優(yōu)勢(shì)。

采用這些工具，嘗試工作流程，并為您的團(tuán)隊(duì)找到正確的方法。Monorepo管理不一定是一種痛苦——它可以是一種有益的體驗(yàn)，可以促進(jìn)協(xié)作、代碼重用和高效開發(fā)。

享受編碼，愿您的monorepo之旅取得成功！

關(guān)鍵詞：