專案程式碼組織：Polyrepo vs. Monorepo

專案程式碼組織主要有兩種方式：

1. Polyrepo: 將專案代碼分散在不同的倉(cāng)庫(kù)。這是目前的標(biāo)準(zhǔn)做法，多個(gè)團(tuán)隊(duì)分別擁有自己的倉(cāng)庫(kù)、建造產(chǎn)物和流水線，擁有自主權(quán)。
2. Monorepo: 將所有項(xiàng)目代碼集中在一個(gè)倉(cāng)庫(kù)。專案被劃分為應(yīng)用程式和套件，方便程式碼重複使用和共享標(biāo)準(zhǔn)功能，有助於統(tǒng)一第三方包版本、遞歸構(gòu)建依賴項(xiàng)的原始程式碼以及使用相同的工具進(jìn)行CI/CD管線。

許多大型科技公司都使用Monorepo，例如Yandex。 Monorepo有助於在團(tuán)隊(duì)和業(yè)務(wù)部門之間共享創(chuàng)意和最佳實(shí)踐。更多關(guān)於Monorepo和相關(guān)工具的信息，請(qǐng)?jiān)L問(wèn)http://m.miracleart.cn/link/b01ccf4f29b57b0b1bdb9407050db28d。本文將重點(diǎn)放在使用PNPM建立Monorepo的簡(jiǎn)單方案。

PNPM使用工作區(qū)(workspaces)來(lái)整合單一倉(cāng)庫(kù)中的多個(gè)項(xiàng)目。

環(huán)境搭建

首先，建立一個(gè)空資料夾作為新的Monorepo專案。在倉(cāng)庫(kù)內(nèi)初始化PNPM：

pnpm init

然後，建立一個(gè)pnpm-workspace.yaml文件，描述包資料夾：

// pnpm-workspace.yaml

packages:
  - 'packages/**'
  - 'apps/**'

/packages資料夾存放共用程式庫(kù)，/apps資料夾存放應(yīng)用程式（例如，獨(dú)立的React Native行動(dòng)應(yīng)用程式和使用相同元件或連接程式庫(kù)與API伺服器通訊的Web應(yīng)用程式）。

本文將使用一個(gè)Telegram發(fā)布機(jī)器人為例，其原始碼位於GitHub：http://m.miracleart.cn/link/8164ca2fe04767628ac1c6813e8a0867。下載並解壓縮到/apps/publish-bot資料夾，然後執(zhí)行安裝指令：

pnpm install

建立Telegram工具包

在/packages資料夾中建立一個(gè)名為telegram-utils的資料夾，初始化PNPM和TypeScript：

pnpm init && pnpm add -D typescript && pnpm tsc --init

該套件將提供一個(gè)函數(shù)，用於組合來(lái)自所有訊息（文字、影片和照片）的文字和標(biāo)題。需要安裝Telegraf包：

pnpm add telegraf

所有原始碼都應(yīng)位於/src目錄中。為了方便功能分組，建議建立不同的資料夾。組合文字的功能位於/texts資料夾中，程式碼如下：

// packages/telegram-utils/src/texts/combineTexts.ts

import { Message } from 'telegraf/types';
import { FmtString, join } from 'telegraf/format';

type GroupedMessages = {
    photos: Array<Message.PhotoMessage>;
    videos: Array<Message.VideoMessage>;
    text: Array<Message.TextMessage>;
};

export const combineTexts = ({ photos, videos, text }: GroupedMessages) => {
    const photoTexts = photos
        .map(photo => photo.caption ? new FmtString(photo.caption, photo.caption_entities) : undefined)
        .filter((t): t is Required<FmtString> => t !== undefined);

    const videoTexts = videos
        .map(video => video.caption ? new FmtString(video.caption, video.caption_entities) : undefined)
        .filter((t): t is Required<FmtString> => t !== undefined);

    const allTexts = [];

    if (text.length) allTexts.push(join(text.map(t => new FmtString(t.text, t.entities))), '\n');
    if (photoTexts.length) allTexts.push(join(photoTexts, '\n'));
    if (videoTexts.length) allTexts.push(join(videoTexts, '\n'));

    return join(allTexts, '\n');
};

代碼說(shuō)明：

• 函數(shù)輸入按類型分組的訊息：照片、影片或文字；
• 媒體訊息應(yīng)轉(zhuǎn)換為包含標(biāo)題和標(biāo)題實(shí)體的FMT字串。對(duì)於後續(xù)過(guò)濾，應(yīng)返回undefined；
• 分步連接文字?jǐn)?shù)組，最終將所有文字組合成一條大訊息。

建立/texts資料夾的索引檔：

pnpm init

在package.json檔案中使用exports欄位設(shè)定套件功能的匯出：

// pnpm-workspace.yaml

packages:
  - 'packages/**'
  - 'apps/**'

為了在應(yīng)用程式中辨識(shí)Monorepo包，為所有包加上前綴@monorepo。重新命名package.json檔案中的telegram-utils套件：

pnpm install

新增建置腳本：

pnpm init && pnpm add -D typescript && pnpm tsc --init

完整的package.json檔案：

pnpm add telegraf

設(shè)定TypeScript編譯器：?jiǎn)⒂迷隽烤幾g以節(jié)省建置時(shí)間，僅處理變更的部分；啟用複合編譯以使用專案參考。將/src資料夾定義為rootDir，將套件的outDir定義為/dist。更新後的tsconfig.json：

// packages/telegram-utils/src/texts/combineTexts.ts

import { Message } from 'telegraf/types';
import { FmtString, join } from 'telegraf/format';

type GroupedMessages = {
    photos: Array<Message.PhotoMessage>;
    videos: Array<Message.VideoMessage>;
    text: Array<Message.TextMessage>;
};

export const combineTexts = ({ photos, videos, text }: GroupedMessages) => {
    const photoTexts = photos
        .map(photo => photo.caption ? new FmtString(photo.caption, photo.caption_entities) : undefined)
        .filter((t): t is Required<FmtString> => t !== undefined);

    const videoTexts = videos
        .map(video => video.caption ? new FmtString(video.caption, video.caption_entities) : undefined)
        .filter((t): t is Required<FmtString> => t !== undefined);

    const allTexts = [];

    if (text.length) allTexts.push(join(text.map(t => new FmtString(t.text, t.entities))), '\n');
    if (photoTexts.length) allTexts.push(join(photoTexts, '\n'));
    if (videoTexts.length) allTexts.push(join(videoTexts, '\n'));

    return join(allTexts, '\n');
};

整合

回到/apps/publish-bot，將@monorepo/telegram-utils套件加入依賴項(xiàng)。注意，不需要指定套件版本，使用workspace:*表示：

// packages/telegram-utils/src/texts/index.ts

export * from './combineTexts';

安裝依賴項(xiàng)：

// packages/telegram-utils/package.json

"exports": {
    "./texts": {
        "import": "./src/texts/index.ts",
        "require": "./dist/texts/index.js"
    }
}

更新發(fā)布機(jī)器人的preview指令：

// packages/telegram-utils/package.json

"name": "@monorepo/telegram-utils"

更新/apps/publish-bot/tsconfig.json：

// packages/telegram-utils/package.json

"scripts": {
    "build": "tsc -p tsconfig.json"
}

在建構(gòu)應(yīng)用程式碼前，需要先建置所有依賴項(xiàng)：

// packages/telegram-utils/package.json

{
    "name": "@monorepo/telegram-utils",
    "version": "1.0.0",
    "main": "index.js",
    "scripts": {
        "build": "tsc -p tsconfig.json"
    },
    "keywords": [],
    "license": "ISC",
    "exports": {
        "./texts": {
            "import": "./src/texts/index.ts",
            "require": "./dist/texts/index.js"
        }
    },
    "devDependencies": {
        "typescript": "^5.7.3"
    },
    "dependencies": {
        "telegraf": "^4.16.3"
    }
}

總結(jié)

現(xiàn)在，發(fā)布機(jī)器人使用內(nèi)部共享庫(kù)/包，並位於Monorepo中。這使得快速建立新功能和在多個(gè)應(yīng)用程式中重複使用程式碼成為可能。

圖片來(lái)自Unsplash的Gabriel Heinzer

以上是使用 PNPM 在 Monorepo 中建置並運(yùn)行您的專案的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！