مونوریپو فرانت‌اند: مدیریت ورک‌اسپیس با Lerna و Nx

در چشم‌انداز همواره در حال تغییر توسعه فرانت‌اند، مدیریت پروژه‌های بزرگ و پیچیده می‌تواند یک چالش مهم باشد. راه‌اندازی‌های چند-ریپوی سنتی، در حالی که ایزولاسیون را ارائه می‌دهند، می‌توانند منجر به تکرار کد، مشکلات مدیریت وابستگی و ابزارهای ناسازگار شوند. اینجاست که معماری مونوریپو می‌درخشد. مونوریپو یک مخزن واحد است که شامل چندین پروژه، که اغلب مرتبط هستند، می‌شود و با هم ساخته و نسخه‌بندی می‌شوند. این رویکرد مزایای بی‌شماری را ارائه می‌دهد، اما مدیریت موثر یک مونوریپو به ابزارهای تخصصی نیاز دارد. این مقاله دو راهکار محبوب را بررسی می‌کند: Lerna و Nx.

مونوریپو چیست؟

مونوریپو یک مخزن سیستم کنترل نسخه است که کدهای بسیاری از پروژه‌ها را در خود جای می‌دهد. این پروژه‌ها می‌توانند مرتبط یا کاملاً مستقل باشند. نکته کلیدی این است که آنها یک مخزن مشترک دارند. شرکت‌هایی مانند گوگل، فیس‌بوک، مایکروسافت و اوبر با موفقیت مونوریپوها را برای مدیریت کُدبِیس‌های عظیم خود به کار گرفته‌اند. به گوگل فکر کنید که تقریباً تمام کدهای خود، از جمله اندروید، کروم و جیمیل را در یک مخزن واحد ذخیره می‌کند.

مزایای یک مونوریپو

• اشتراک‌گذاری و استفاده مجدد از کد: به راحتی کد را بین پروژه‌ها بدون نیاز به فرآیندهای پیچیده بسته‌بندی و انتشار به اشتراک بگذارید. تصور کنید یک کتابخانه سیستم طراحی که می‌تواند به طور یکپارچه در چندین برنامه کاربردی در همان مخزن ادغام شود.
• مدیریت وابستگی ساده‌تر: وابستگی‌ها را در یک مکان واحد مدیریت کنید و از یکپارچگی در تمام پروژه‌ها اطمینان حاصل کنید. به‌روزرسانی وابستگی یک کتابخانه مشترک به طور خودکار تمام پروژه‌های وابسته به آن را به‌روز می‌کند.
• تغییرات اتمی: تغییراتی را انجام دهید که در چندین پروژه در یک کامیت واحد گسترش می‌یابد، که تضمین‌کننده یکپارچگی و ساده‌سازی تست است. برای مثال، یک بازآرایی که هم فرانت‌اند و هم بک‌اند را تحت تأثیر قرار می‌دهد، می‌تواند به صورت اتمی انجام شود.
• همکاری بهبود یافته: تیم‌ها می‌توانند به راحتی در پروژه‌های مختلف در یک مخزن واحد همکاری کنند، که باعث تبادل دانش و توسعه بین‌تیمی می‌شود. توسعه‌دهندگان می‌توانند به راحتی کد را در بین تیم‌های مختلف مرور کرده و درک کنند.
• ابزارها و رویه‌های ثابت: استانداردهای کدنویسی، قوانین linting و فرآیندهای ساخت ثابت را در تمام پروژه‌ها اعمال کنید. این کار کیفیت و قابلیت نگهداری کد را بهبود می‌بخشد.
• بازآرایی ساده‌تر: پروژه‌های بازآرایی در مقیاس بزرگ ساده‌تر می‌شوند زیرا تمام کدهای مرتبط در یک مخزن واحد قرار دارند. ابزارهای بازآرایی خودکار می‌توانند در کل کُدبِیس استفاده شوند.

چالش‌های یک مونوریپو

• اندازه مخزن: مونوریپوها می‌توانند بسیار بزرگ شوند و به طور بالقوه عملیات شبیه‌سازی و ایندکس‌گذاری را کند کنند. ابزارهایی مانند `git sparse-checkout` و `partial clone` می‌توانند به کاهش این مشکل کمک کنند.
• زمان‌های ساخت: ساخت کل مونوریپو می‌تواند زمان‌بر باشد، به خصوص برای پروژه‌های بزرگ. ابزارهایی مانند Lerna و Nx فرآیندهای ساخت بهینه‌سازی شده را برای رفع این مشکل ارائه می‌دهند.
• کنترل دسترسی: محدود کردن دسترسی به بخش‌های خاصی از مونوریپو می‌تواند پیچیده باشد. برنامه‌ریزی دقیق و پیاده‌سازی مکانیزم‌های کنترل دسترسی ضروری است.
• پیچیدگی ابزارها: راه‌اندازی و مدیریت یک مونوریپو به ابزارها و دانش تخصصی نیاز دارد. منحنی یادگیری در ابتدا می‌تواند شیب‌دار باشد.

Lerna: مدیریت پروژه‌های جاوا اسکریپت در یک مونوریپو

Lerna ابزاری محبوب برای مدیریت پروژه‌های جاوا اسکریپت در یک مونوریپو است. این ابزار گردش کار پیرامون مدیریت مخازن چند-بسته‌ای با Git و npm را بهینه می‌کند. این ابزار به ویژه برای پروژه‌هایی که از npm یا Yarn برای مدیریت وابستگی استفاده می‌کنند، مناسب است.

ویژگی‌های کلیدی Lerna

• مدیریت نسخه: Lerna می‌تواند به طور خودکار بسته‌ها را بر اساس تغییرات ایجاد شده از آخرین انتشار، نسخه‌بندی و منتشر کند. این ابزار از conventional commits برای تعیین شماره نسخه بعدی استفاده می‌کند.
• مدیریت وابستگی: Lerna وابستگی‌های بین بسته‌ها را مدیریت می‌کند و اطمینان می‌دهد که بسته‌ها در داخل مونوریپو می‌توانند به یکدیگر وابسته باشند. این ابزار از symlinking برای ایجاد وابستگی‌های محلی استفاده می‌کند.
• اجرای وظیفه: Lerna می‌تواند دستورات را در چندین بسته به صورت موازی اجرا کند و فرآیندهای ساخت و تست را سرعت بخشد. این ابزار از اجرای اسکریپت‌های تعریف شده در `package.json` پشتیبانی می‌کند.
• تشخیص تغییر: Lerna می‌تواند تشخیص دهد کدام بسته‌ها از آخرین انتشار تغییر کرده‌اند، که امکان ساخت‌ها و استقرارهای هدفمند را فراهم می‌کند.

مثال استفاده از Lerna

بیایید استفاده از Lerna را با یک مثال ساده توضیح دهیم. فرض کنید یک مونوریپو با دو بسته داریم: `package-a` و `package-b`. `package-b` به `package-a` وابسته است.

monorepo/
├── lerna.json
├── package.json
├── packages/
│   ├── package-a/
│   │   ├── package.json
│   │   └── index.js
│   └── package-b/
│       ├── package.json
│       └── index.js

1. مقداردهی اولیه Lerna:

lerna init

این کار `lerna.json` را ایجاد می‌کند و `package.json` ریشه را به‌روزرسانی می‌کند. فایل `lerna.json` رفتار Lerna را پیکربندی می‌کند.

2. نصب وابستگی‌ها:

npm install
# or
yarn install

این کار وابستگی‌های تمام بسته‌های موجود در مونوریپو را بر اساس فایل‌های `package.json` در هر بسته نصب می‌کند.

3. اجرای یک دستور در سراسر بسته‌ها:

lerna run test

این کار اسکریپت `test` تعریف شده در فایل‌های `package.json` همه بسته‌هایی که آن را تعریف کرده‌اند، اجرا می‌کند.

4. انتشار بسته‌ها:

lerna publish

این دستور تاریخچه کامیت‌ها را تحلیل می‌کند، تشخیص می‌دهد کدام بسته‌ها تغییر کرده‌اند، نسخه‌های آنها را بر اساس conventional commits به‌روزرسانی می‌کند و آنها را در npm (یا رجیستری انتخابی شما) منتشر می‌کند.

پیکربندی Lerna

فایل `lerna.json` قلب پیکربندی Lerna است. این فایل به شما امکان می‌دهد رفتار Lerna را سفارشی کنید، مانند:

• `packages`: مکان بسته‌ها را در داخل مونوریپو مشخص می‌کند. اغلب روی `["packages/*"]` تنظیم می‌شود.
• `version`: استراتژی نسخه‌بندی را مشخص می‌کند. می‌تواند `independent` (هر بسته نسخه مخصوص به خود را دارد) یا یک نسخه ثابت باشد.
• `command`: به شما امکان می‌دهد گزینه‌هایی را برای دستورات خاص Lerna، مانند `publish` و `run`، پیکربندی کنید.

مثال `lerna.json`:

{
  "packages": [
    "packages/*"
  ],
  "version": "independent",
  "npmClient": "npm",
  "useWorkspaces": true,
  "command": {
    "publish": {
      "conventionalCommits": true,
      "message": "chore(release): publish"
    }
  }
}

Nx: سیستم ساخت هوشمند، سریع و قابل توسعه

Nx یک سیستم ساخت قدرتمند است که ویژگی‌های پیشرفته‌ای را برای مدیریت مونوریپو ارائه می‌دهد. این سیستم بر روی ساخت‌های افزایشی، کش کردن محاسبات و ارکستراسیون وظایف تمرکز دارد تا زمان‌های ساخت و بهره‌وری توسعه‌دهنده را به طور قابل توجهی بهبود بخشد. در حالی که Lerna عمدتاً بر مدیریت بسته‌ها تمرکز دارد، Nx رویکرد جامع‌تری را برای مدیریت کل گردش کار مونوریپو، از جمله تولید کد، linting، تست و استقرار، فراهم می‌کند.

ویژگی‌های کلیدی Nx

• ساخت‌های افزایشی: Nx نمودار وابستگی پروژه‌های شما را تحلیل می‌کند و فقط پروژه‌هایی را که از آخرین ساخت تغییر کرده‌اند، دوباره می‌سازد. این کار زمان‌های ساخت را به طرز چشمگیری کاهش می‌دهد.
• کش کردن محاسبات: Nx نتایج وظایف، مانند ساخت‌ها و تست‌ها، را کش می‌کند تا در صورت عدم تغییر ورودی‌ها، بتوان از آنها دوباره استفاده کرد. این کار چرخه‌های توسعه را بیشتر سرعت می‌بخشد.
• ارکستراسیون وظیفه: Nx یک سیستم ارکستراسیون وظیفه قدرتمند را ارائه می‌دهد که به شما امکان می‌دهد پایپ‌لاین‌های ساخت پیچیده را تعریف کرده و آنها را به طور کارآمد اجرا کنید.
• تولید کد: Nx ابزارهای تولید کد را فراهم می‌کند که می‌تواند به شما در ایجاد سریع پروژه‌ها، کامپوننت‌ها و ماژول‌های جدید کمک کند و از بهترین شیوه‌ها و استانداردهای ثابت پیروی کند.
• اکوسیستم پلاگین: Nx دارای یک اکوسیستم پلاگین غنی است که از فناوری‌ها و فریم‌ورک‌های مختلفی مانند React، Angular، Node.js، NestJS و موارد دیگر پشتیبانی می‌کند.
• تجسم نمودار وابستگی: Nx می‌تواند نمودار وابستگی مونوریپوی شما را تجسم کند و به شما کمک می‌کند روابط بین پروژه‌ها را درک کرده و مسائل بالقوه را شناسایی کنید.
• دستوراتAffected: Nx دستوراتی را برای اجرای وظایف فقط بر روی پروژه‌هایی که تحت تأثیر یک تغییر خاص قرار گرفته‌اند، فراهم می‌کند. این به شما امکان می‌دهد تلاش‌های خود را بر روی مناطقی که نیاز به توجه دارند، متمرکز کنید.

مثال استفاده از Nx

بیایید استفاده از Nx را با یک مثال ساده توضیح دهیم. ما یک مونوریپو با یک برنامه React و یک کتابخانه Node.js ایجاد خواهیم کرد.

1. نصب Nx CLI به صورت گلوبال:

npm install -g create-nx-workspace

2. ایجاد یک ورک‌اسپیس جدید Nx:

create-nx-workspace my-monorepo --preset=react
cd my-monorepo

این یک ورک‌اسپیس جدید Nx با یک برنامه React ایجاد می‌کند. گزینه `--preset=react` به Nx می‌گوید که ورک‌اسپیس را با پیکربندی‌های خاص React مقداردهی اولیه کند.

3. تولید یک کتابخانه:

nx generate @nrwl/node:library my-library

این یک کتابخانه Node.js جدید به نام `my-library` تولید می‌کند. Nx به طور خودکار کتابخانه و وابستگی‌های آن را پیکربندی می‌کند.

4. ساخت برنامه:

nx build my-app

این کار برنامه React را می‌سازد. Nx نمودار وابستگی را تحلیل می‌کند و فقط فایل‌های لازم را دوباره می‌سازد.

5. اجرای تست‌ها:

nx test my-app

این کار تست‌های واحد برنامه React را اجرا می‌کند. Nx نتایج تست را کش می‌کند تا اجرای تست‌های بعدی را سرعت بخشد.

6. مشاهده نمودار وابستگی:

nx graph

این یک رابط وب را باز می‌کند که نمودار وابستگی مونوریپو را تجسم می‌کند.

پیکربندی Nx

Nx از طریق فایل `nx.json` که در ریشه ورک‌اسپیس قرار دارد، پیکربندی می‌شود. این فایل پروژه‌های موجود در ورک‌اسپیس، وابستگی‌های آنها و وظایفی که می‌توانند روی آنها اجرا شوند را تعریف می‌کند.

گزینه‌های پیکربندی کلیدی در `nx.json` عبارتند از:

• `projects`: پروژه‌های موجود در ورک‌اسپیس و پیکربندی آنها، مانند دایرکتوری ریشه و هدف‌های ساخت، را تعریف می‌کند.
• `tasksRunnerOptions`: اجراکننده وظیفه را پیکربندی می‌کند، که مسئول اجرای وظایف و کش کردن نتایج آنها است.
• `affected`: نحوه تشخیص Nx برای اینکه کدام پروژه‌ها تحت تأثیر یک تغییر قرار گرفته‌اند را پیکربندی می‌کند.

مثال `nx.json`:

{
  "npmScope": "my-org",
  "affected": {
    "defaultBase": "main"
  },
  "implicitDependencies": {
    "package.json": {
      "dependencies": "*",
      "devDependencies": "*"
    },
    ".eslintrc.json": "*"
  },
  "tasksRunnerOptions": {
    "default": {
      "runner": "nx-cloud",
      "options": {
        "cacheableOperations": ["build", "lint", "test", "e2e"],
        "accessToken": "...",
        "canTrackAnalytics": false,
        "showUsageWarnings": false
      }
    }
  },
  "targetDefaults": {
    "build": {
      "dependsOn": ["^build"],
      "inputs": ["production", "default"],
      "outputs": ["{projectRoot}/dist"]
    }
  },
  "namedInputs": {
    "default": ["{projectRoot}/**/*", "!{projectRoot}/dist/**/*", "!{projectRoot}/tmp/**/*"],
    "production": ["!{projectRoot}/**/*.spec.ts", "!{projectRoot}/**/*.spec.tsx", "!{projectRoot}/**/*.spec.js", "!{projectRoot}/**/*.spec.jsx"]
  },
  "generators": {
    "@nrwl/react": {
      "application": {
        "style": "css",
        "linter": "eslint",
        "unitTestRunner": "jest"
      },
      "library": {
        "style": "css",
        "linter": "eslint",
        "unitTestRunner": "jest"
      },
      "component": {
        "style": "css"
      }
    },
  }
}

Lerna در برابر Nx: کدام یک را انتخاب کنیم؟

هر دو Lerna و Nx ابزارهای عالی برای مدیریت مونوریپوهای فرانت‌اند هستند، اما نیازهای کمی متفاوتی را برآورده می‌کنند. در اینجا مقایسه‌ای ارائه می‌شود تا به شما در انتخاب مناسب‌ترین ابزار برای پروژه خود کمک کند:

ویژگی	Lerna	Nx
تمرکز	مدیریت بسته	سیستم ساخت و ارکستراسیون وظیفه
ساخت‌های افزایشی	محدود (به ابزارهای خارجی نیاز دارد)	داخلی و بسیار بهینه شده
کش کردن محاسبات	خیر	بله
تولید کد	خیر	بله
اکوسیستم پلاگین	محدود	گسترده
منحنی یادگیری	پایین‌تر	بالاتر
پیچیدگی	ساده‌تر	پیچیده‌تر
موارد استفاده	پروژه‌هایی که عمدتاً بر مدیریت و انتشار بسته‌های npm تمرکز دارند.	پروژه‌های بزرگ و پیچیده نیازمند زمان‌های ساخت بهینه شده، تولید کد و یک سیستم ساخت جامع.

Lerna را انتخاب کنید اگر:

• عمدتاً نیاز به مدیریت و انتشار بسته‌های npm دارید.
• پروژه شما نسبتاً کوچک تا متوسط است.
• ابزار ساده‌تری با منحنی یادگیری پایین‌تر را ترجیح می‌دهید.
• قبلاً با npm و Yarn آشنا هستید.

Nx را انتخاب کنید اگر:

• به زمان‌های ساخت بهینه شده و ساخت‌های افزایشی نیاز دارید.
• قابلیت‌های تولید کد را می‌خواهید.
• به یک سیستم ساخت جامع با ارکستراسیون وظایف نیاز دارید.
• پروژه شما بزرگ و پیچیده است.
• حاضرید برای یادگیری یک ابزار قدرتمندتر زمان بگذارید.

آیا می‌توانید Lerna را با Nx استفاده کنید؟

بله، Lerna و Nx را می‌توان با هم استفاده کرد. این ترکیب به شما امکان می‌دهد از قابلیت‌های مدیریت بسته Lerna بهره‌مند شوید در حالی که از سیستم ساخت بهینه شده و ارکستراسیون وظیفه Nx سود می‌برید. Nx را می‌توان به عنوان یک اجراکننده وظیفه برای Lerna پیکربندی کرد، که ساخت‌های افزایشی و کش کردن محاسبات را برای بسته‌های مدیریت شده توسط Lerna فراهم می‌کند.

بهترین شیوه‌ها برای مدیریت مونوریپو فرانت‌اند

صرف نظر از اینکه Lerna یا Nx را انتخاب می‌کنید، رعایت بهترین شیوه‌ها برای مدیریت موفق یک مونوریپو فرانت‌اند حیاتی است:

• ایجاد ساختار پروژه شفاف: پروژه‌های خود را منطقی و سازگار سازماندهی کنید. از یک قرارداد نام‌گذاری واضح برای بسته‌ها و کتابخانه‌ها استفاده کنید.
• اعمال استانداردهای کدنویسی ثابت: از linters و formatters برای اطمینان از سبک کد ثابت در تمام پروژه‌ها استفاده کنید. ابزارهایی مانند ESLint و Prettier را می‌توان در گردش کار شما ادغام کرد.
• خودکارسازی فرآیندهای ساخت و تست: از پایپ‌لاین‌های CI/CD برای خودکارسازی فرآیندهای ساخت، تست و استقرار استفاده کنید. ابزارهایی مانند Jenkins، CircleCI و GitHub Actions را می‌توان به کار برد.
• پیاده‌سازی بازبینی کد: بازبینی‌های دقیق کد را برای اطمینان از کیفیت و قابلیت نگهداری کد انجام دهید. از pull requests و ابزارهای بازبینی کد استفاده کنید.
• نظارت بر زمان‌های ساخت و عملکرد: زمان‌های ساخت و معیارهای عملکرد را پیگیری کنید تا تنگناها و زمینه‌های بهبود را شناسایی کنید. Nx ابزارهایی برای تحلیل عملکرد ساخت فراهم می‌کند.
• مستندسازی ساختار و فرآیندهای مونوریپو: مستندات شفافی ایجاد کنید که ساختار مونوریپو، ابزارها و فناوری‌های مورد استفاده، و گردش کارهای توسعه را توضیح می‌دهد.
• پذیرش Conventional Commits: از conventional commits برای خودکارسازی فرآیندهای نسخه‌بندی و انتشار استفاده کنید. Lerna به طور پیش‌فرض از conventional commits پشتیبانی می‌کند.

نتیجه‌گیری

مونوریپوهای فرانت‌اند مزایای قابل توجهی را برای مدیریت پروژه‌های بزرگ و پیچیده ارائه می‌دهند، از جمله اشتراک‌گذاری کد، مدیریت وابستگی ساده‌تر و همکاری بهبود یافته. Lerna و Nx ابزارهای قدرتمندی هستند که می‌توانند به شما در مدیریت موثر یک مونوریپو فرانت‌اند کمک کنند. Lerna یک انتخاب عالی برای مدیریت بسته‌های npm است، در حالی که Nx یک سیستم ساخت جامع‌تر با ویژگی‌های پیشرفته مانند ساخت‌های افزایشی و تولید کد فراهم می‌کند. با در نظر گرفتن دقیق نیازهای پروژه خود و رعایت بهترین شیوه‌ها، می‌توانید با موفقیت یک مونوریپو فرانت‌اند را پیاده‌سازی کرده و از مزایای آن بهره‌مند شوید.

به یاد داشته باشید که هنگام انتخاب بین Lerna و Nx، عواملی مانند تجربه تیم شما، پیچیدگی پروژه و الزامات عملکرد را در نظر بگیرید. هر دو ابزار را آزمایش کنید و ابزاری را پیدا کنید که به بهترین وجه با نیازهای خاص شما مطابقت دارد.

موفق باشید در سفر مونوریپوی خود!