Для разработчиков построение масштабируемых и поддерживаемых приложений может быть значительным вызовом, особенно при работе с большими кодовыми базами и несколькими сервисами. К счастью, использование подхода монорепозитория в сочетании с мощными инструментами, такими как NX, Lerna и Yarn, может обеспечить упрощенный процесс разработки, который повышает общность кода и возможность повторного использования.

Это подробное руководство нацелено на помощь разработчикам в настройке монорепозитория с использованием NX, Lerna и Yarn. Руководство включает подробную информацию о начальной настройке, структуре каталогов, управлении зависимостями, тестировании и развёртывании.

После освоения туториала разработчик получат полное понимание того, как создавать масштабируемые и поддерживаемые приложения, используя подход монорепозитория. Он также получит знания о необходимых инструментах и знаниях для перехода на новый уровень разработки. Давайте приступим!

Требования

• Lerna и Yarn для управления монорепозиторием

• NX для контроля версий монорепозиториев

• NestJS в качестве API-сервиса, который обслуживает запросы администрирования под префиксом API-эндпоинта /admin

• Приложение Angular для административного фронтенда управления сервисом NestJS

• Настройка монорепозитория

• Пакет common будет содержать код, который может использоваться любым приложением, такой как интерфейсы, enum и т.д.

• Пакет common-be предназначен для общих библиотек, используемых исключительно сервисом API

• Пакет common-fe должен содержать общие библиотеки только фронтенда Angular

• Докеризация приложения с помощью docker-compose.yml и Dockerfile

Репозиторий Git

Все файлы для этого туториала можно найти тут.

Предварительные требования

Yarn

Устанавливаем Yarn и проверяем версию.
С этого момента мы будем использовать Yarn для управления пакетами.

~$ npm install -g yarn**
~$ yarn --version**

Lerna

Устанавливаем Lerna глобально и проверяем версию.

~$ yarn global add lerna
~$ lerna -v

NestJS CLI

Добавляем NestJS CLI в глобальные зависимости и проверяем версию.

~$ yarn global add @nestjs/cli
~$ nest -v

Angular CLI

Устанавливаем Angular CLI как глобальный пакет и проверяем версию.

~$ yarn global add @angular/cli
~$ ng --version

Часть 1: Настройка монорепозитория и структуры каталогов

Что нужно сделать:

1. Инициализировать монорепозиторий

2. Инициализировать сервисы как рабочие пространства Yarn

3. Добавить приложение NestJS

4. Добавить приложение Angular

Дорожная карта

Сделайте следующее чтобы создать и запустить монорепозиторий с несколькими службами с помощью Lerna и Yarn.

Инициализация монорепозитория

Создайте новый пустой каталог для вашего монорепозитория, в моем случае это lehcode.

~$ mkdir [your-repo-name] && cd [your-repo-name]

Следующая команда инициализирует каталог как Yarn workspace

~/lehcode$ yarn init
yarn init v1.22.19
success Saved package.json

Добавьте Lerna в devDependency

~/lehcode$ yarn add -D lerna

Инициализируйте Lerna, выполнив следующую команду; она создаст файл конфигурации lerna.json и каталог пакетов в корне монорепозитория. Ознакомьтесь с документацией по Lerna.

~/lehcode$ npx lerna init

Инициализация сервисов как рабочих пространств Yarn

~/lehcode$ mkdir packages/{api,admin,shared,common-be,common-fe}

Эта команда создает новую структуру каталогов в каталоге packages монорепозитория с пятью подкаталогами: api, admin для приложений; а также shared, common-be, common-fe для общих библиотек. Эти каталоги будут использоваться для исходного кода и файлов конфигурации сервиса API, интерфейса администратора и различных общих библиотек, соответственно. На этом этапе структура папок должна выглядеть примерно так:

.
├── lerna.json
├── node_modules
├── package.json
├── packages
│   ├── admin
│   │   ├── node_modules
│   │   └── package.json
│   ├── api
│   │   ├── node_modules
│   │   └── package.json
│   ├── shared
│   │   └── package.json
│   ├── common-be
│   │   └── package.json
│   └── common-fe
│   │   └── package.json
└── yarn.lock

Добавить приложение NestJS в монорепозиторий

Следующие шаги объяснят как добавить приложение NestJS в наш существующий монорепозиторий в качестве рабочей области (workspace) Yarn.
Создайте новое приложение NestJS, выполнив команду:

~/lehcode$ nest new [--dry-run] --directory packages/api/ -p yarn --strict

Эта команда создаёт новое приложение NestJS и настраивает Yarn в качестве менеджера пакетов в каталоге packages/api. Флаг ‑-strict включает строгий режим для компилятора TypeScript.
Попробуйте добавить флаг --dry-run или -d при первом запуске, чтобы имитировать создание приложения NestJS без внесения реальных изменений в файловую систему.

Установите пакет @nrwl/nest в корневую рабочую область, выполнив команду

~/lehcode$ yarn add -D @nrwl/nest
~/lehcode$ cd packages/api/

Настройте сервис API NestJS для обслуживания запросов на администрирование в точке входа /admin, клиентских запросов в точке входа /client. Это можно сделать, изменив конфигурацию маршрутизации в файле app.module.ts.
Вернитесь в корневой каталог монорепозитория.

~/lehcode/packages/api$ cd ../../

Добавить приложение Angular в монорепозиторий

Инициализация внешнего приложения Angular для администрирования серверной части.

~/lehcode$ ng new --create-application --directory=packages/admin --new-project-root=./ --package-manager=yarn --style=scss
? What name would you like to use for the new workspace and initial project? admin
? Would you like to add Angular routing? Yes

Вы можете добавить флаг --dry-run при первом запуске, чтобы имитировать создание приложения Angular без применения фактических изменений.

Перейдите в папку пакета:

~/lehcode$ cd packages/admin/

Вручную запустите yarn dev один раз, чтобы ответить на запрос об обмене данными. В противном случае при сборке контейнер зависнет.
Вернитесь в корень репозитория:

~/lehcode/packages/admin$ cd ../../

Заключительные шаги

Обновите файл package.json в каталоге каждого сервиса (в ./packages/), чтобы поле имени было в формате "<myorg>/<service-name>". Это гарантирует, что у каждого сервиса будет уникальное имя пакета, которое можно использовать для управления им с помощью Yarn.

Установите необходимые пакеты @nrwl, выполнив следующую команду

~/lehcode$ yarn add -D @nrwl/workspace @nrwl/nest @nrwl/angular

Общие библиотеки

Добавьте общие библиотеки для API, выполнив команду

~/lehcode$ nx g @nrwl/workspace:lib common-be

Добавьте любой необходимый код в библиотеку common-be и настройте сервис API для использования библиотеки, импортировав её в файл app.module.ts.

Добавьте общие библиотеки для интерфейса администратора, выполнив команду

~/lehcode$ nx g @nrwl/workspace:lib common-fe

Добавьте любой необходимый код в библиотеку common-fe и настройте интерфейс администратора для использования библиотеки, импортировав её в соответствующие файлы.

Часть 2. Настройка и управление версиями Git в монорепозитории с помощью NX

Конфигурация

NX предоставляет удобный способ настройки управления версиями Git в монорепозитории, что позволяет легко управлять тегами версий. С помощью команды nx version вы можете настроить управление версиями для каждого пакета в вашем монорепозитории, и NX будет автоматически генерировать и обновлять теги версии в Git при внесении изменений в пакеты.

Эта функция особенно полезна, когда в вашем монорепозитории есть несколько пакетов, которые зависят друг от друга. Благодаря поддержке версий Git вы можете легко отслеживать изменения и зависимости между пакетами и обеспечивать использование правильных версий.

Команда nx version используется для настройки управления версиями Git в монорепозитории, управляемом NX. Эта часть покажет вам процесс создания и обновления тегов версий в Git для пакетов в вашем монорепозитории.

Выполните следующие действия, чтобы настроить управление версиями Git для своего монорепозитория с помощью NX. NX автоматически обновит номера версий в файлах package.json и создаст теги Git для каждой из новых версий.

1. Убедитесь, что вы инициализировали Git в своем монорепозитории, выполнив команду в корневом каталоге. Запустите команду $ git init в корневом каталоге монорепозитория.

2. Запустите команду $ nx version в корневом каталоге монорепозитория. Это откроет интерактивную подсказку, которая проведет вас через процесс управления версиями
   

   1. Выберите, следует ли повышать версии всех пакетов в монорепозитории или только определенного пакета.

   2. Выберите версию для обновления (major, minor или patch).

   3. Выберите, хотите ли вы создать тег Git для новой версии.

   4. Вам будет предложено предварительно просмотреть изменения, которые будут внесены в файлы package.json и историю Git.

   5. Подтвердите изменения версии. Нажмите Enter.

Используйте команду $ nx affected если вам нужно определить влияние изменений в монорепозитории на другие пакеты и службы.