PNPM を使用して Monorepo でプロジェクトをビルドして実行する

プロジェクト コードの構成: Polyrepo と Monorepo

プロジェクト コードを整理するには、主に 2 つの方法があります:

1. Polyrepo: プロジェクト コードを異なるリポジトリに分散します。これが現在の標準的な手法であり、複数のチームが独自の倉庫を持ち、製品とパイプラインを構築し、自律性を持っています。
2. Monorepo: すべてのプロジェクト コードを 1 つのリポジトリに一元化します。プロジェクトは、コードの再利用を容易にし、標準機能を共有するためにアプリケーションとパッケージに分割されます。これにより、サードパーティのパッケージのバージョンを統一し、依存関係のソース コードを再帰的に構築し、CI/CD パイプラインに同じツールを使用できます。

Monorepo は、Yandex などの多くの大手テクノロジー企業によって使用されています。 Monorepo は、チームやビジネス ユニット間でアイデアやベスト プラクティスを共有するのに役立ちます。 Monorepo および関連ツールの詳細については、https://www.php.cn/link/b01ccf4f29b57b0b1bdb9407050db28d をご覧ください。この記事では、PNPM を使用して Monorepo を構築する簡単なソリューションに焦点を当てます。

PNPM は ワークスペース を使用して、複数のプロジェクトを単一のリポジトリに統合します。

環境セットアップ

まず、新しい Monorepo プロジェクトとして空のフォルダーを作成します。ウェアハウスで PNPM を初期化します:

<code class="language-bash">pnpm init</code>

次に、パッケージ フォルダーを説明する pnpm-workspace.yaml ファイルを作成します。

<code class="language-yaml">// pnpm-workspace.yaml

packages:
  - 'packages/**'
  - 'apps/**'</code>

/packages フォルダーには共有ライブラリが保持され、/apps フォルダーにはアプリケーション (たとえば、スタンドアロンの React Native モバイル アプリケーションと、同じコンポーネントまたは接続ライブラリを使用して API サーバーと通信する Web アプリケーション) が保持されます。

この記事では例として Telegram パブリッシング ロボットを使用します。そのソース コードは GitHub にあります: https://www.php.cn/link/8164ca2fe04767628ac1c6813e8a0867。 /apps/publish-bot フォルダーにダウンロードして解凍し、インストール コマンドを実行します:

<code class="language-bash">pnpm install</code>

テレグラムツールキットの作成

/packages フォルダー内に telegram-utils という名前のフォルダーを作成し、PNPM と TypeScript を初期化します。

<code class="language-bash">pnpm init && pnpm add -D typescript && pnpm tsc --init</code>

このパッケージは、すべてのメッセージ (テキスト、ビデオ、写真) のテキストとキャプションを組み合わせる機能を提供します。 Telegraf パッケージをインストールする必要があります:

<code class="language-bash">pnpm add telegraf</code>

すべてのソース コードは /src ディレクトリに配置する必要があります。機能的なグループ化を容易にするために、異なるフォルダーを作成することをお勧めします。テキストを結合する関数は /texts フォルダーにあり、コードは次のとおりです:

<code class="language-typescript">// 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');
};</code>

コードの説明:

• この関数は、写真、ビデオ、またはテキストのタイプごとにグループ化されたメッセージを入力します。
• メディア メッセージは、タイトルとタイトル エンティティを含む FMT 文字列に変換される必要があります。後続のフィルタリングでは、undefined が返される必要があります。
テキスト配列を段階的に連結し、最終的にすべてのテキストを 1 つの大きなメッセージに結合します。

フォルダーのインデックス ファイルを作成します: /texts

<code class="language-bash">pnpm init</code>

ファイルの package.json フィールドを使用して、パッケージ関数のエクスポートを設定します: exports

<code class="language-yaml">// pnpm-workspace.yaml

packages:
  - 'packages/**'
  - 'apps/**'</code>

アプリケーション内の Monorepo パッケージを識別するには、すべてのパッケージに接頭辞

を追加します。 @monorepo ファイル内の package.json パッケージの名前を変更します: telegram-utils

<code class="language-bash">pnpm install</code>

ビルドスクリプトを追加:

<code class="language-bash">pnpm init && pnpm add -D typescript && pnpm tsc --init</code>

完全な

ファイル: package.json

<code class="language-bash">pnpm add telegraf</code>

TypeScript コンパイラーを構成します。インクリメンタル コンパイルを有効にしてビルド時間を節約し、変更された部分のみを処理します。プロジェクト参照を使用するために複合コンパイルを有効にします。

フォルダーを /src として定義し、パッケージの rootDir を outDir として定義します。 /dist を更新しました: tsconfig.json

<code class="language-typescript">// 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');
};</code>

統合

に戻り、/apps/publish-bot パッケージを依存関係に追加します。パッケージのバージョンを指定する必要はないことに注意してください。@monorepo/telegram-utils を使用して次のように示します。 workspace:*

依存関係をインストールします:

<code class="language-typescript">// packages/telegram-utils/src/texts/index.ts

export * from './combineTexts';</code>

ボットを公開するための

<code class="language-json">// packages/telegram-utils/package.json

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

コマンドを更新します:

preview

更新

<code class="language-json">// packages/telegram-utils/package.json

"name": "@monorepo/telegram-utils"</code>

:

/apps/publish-bot/tsconfig.json

アプリケーション コードをビルドする前に、すべての依存関係をビルドする必要があります。

<code class="language-json">// packages/telegram-utils/package.json

"scripts": {
    "build": "tsc -p tsconfig.json"
}</code>

<code class="language-json">// 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"
    }
}</code>

概要

リリース ボットは内部共有ライブラリ/パッケージを使用し、Monorepo に配置されています。これにより、新しい機能を迅速に構築し、複数のアプリケーション間でコードを再利用できるようになります。

Unsplash の Gabriel Heinzer 経由の画像

以上がPNPM を使用して Monorepo でプロジェクトをビルドして実行するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。