Для разработчиков построение масштабируемых и поддерживаемых приложений может быть значительным вызовом, особенно при работе с большими кодовыми базами и несколькими сервисами. К счастью, использование подхода монорепозитория в сочетании с мощными инструментами, такими как NX, Lerna и Yarn, может обеспечить упрощенный процесс разработки, который повышает общность кода и возможность повторного использования.
Это подробное руководство нацелено на помощь разработчикам в настройке монорепозитория с использованием NX, Lerna и Yarn. Руководство включает подробную информацию о начальной настройке, структуре каталогов, управлении зависимостями, тестировании и развёртывании.
После освоения туториала разработчик получат полное понимание того, как создавать масштабируемые и поддерживаемые приложения, используя подход монорепозитория. Он также получит знания о необходимых инструментах и знаниях для перехода на новый уровень разработки. Давайте приступим!
С этого момента мы будем использовать Yarn для управления пакетами.
~$ npm install -g yarn**
~$ yarn --version**
~$ yarn global add lerna
~$ lerna -v
~$ yarn global add @nestjs/cli
~$ nest -v
~$ yarn global add @angular/cli
~$ ng --version
~$ 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
Эта команда создает новую структуру каталогов в каталоге 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, выполнив команду:
~/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 ../../
~/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 ../../
Установите необходимые пакеты @nrwl, выполнив следующую команду
~/lehcode$ yarn add -D @nrwl/workspace @nrwl/nest @nrwl/angular
~/lehcode$ nx g @nrwl/workspace:lib common-be
Добавьте любой необходимый код в библиотеку common-be и настройте сервис API для использования библиотеки, импортировав её в файл app.module.ts.
Добавьте общие библиотеки для интерфейса администратора, выполнив команду
~/lehcode$ nx g @nrwl/workspace:lib common-fe
Добавьте любой необходимый код в библиотеку common-fe и настройте интерфейс администратора для использования библиотеки, импортировав её в соответствующие файлы.
Эта функция особенно полезна, когда в вашем монорепозитории есть несколько пакетов, которые зависят друг от друга. Благодаря поддержке версий Git вы можете легко отслеживать изменения и зависимости между пакетами и обеспечивать использование правильных версий.
Команда nx version используется для настройки управления версиями Git в монорепозитории, управляемом NX. Эта часть покажет вам процесс создания и обновления тегов версий в Git для пакетов в вашем монорепозитории.
Выполните следующие действия, чтобы настроить управление версиями Git для своего монорепозитория с помощью NX. NX автоматически обновит номера версий в файлах package.json и создаст теги Git для каждой из новых версий.
Это подробное руководство нацелено на помощь разработчикам в настройке монорепозитория с использованием 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: Настройка монорепозитория и структуры каталогов
Что нужно сделать:- Инициализировать монорепозиторий
- Инициализировать сервисы как рабочие пространства Yarn
- Добавить приложение NestJS
- Добавить приложение 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 для каждой из новых версий.
- Убедитесь, что вы инициализировали Git в своем монорепозитории, выполнив команду в корневом каталоге. Запустите команду $ git init в корневом каталоге монорепозитория.
- Запустите команду $ nx version в корневом каталоге монорепозитория. Это откроет интерактивную подсказку, которая проведет вас через процесс управления версиями
- Выберите, следует ли повышать версии всех пакетов в монорепозитории или только определенного пакета.
- Выберите версию для обновления (major, minor или patch).
- Выберите, хотите ли вы создать тег Git для новой версии.
- Вам будет предложено предварительно просмотреть изменения, которые будут внесены в файлы package.json и историю Git.
- Подтвердите изменения версии. Нажмите Enter.
Как создать монорепозиторий с несколькими сервисами, используя Lerna и Yarn?
Для разработчиков построение масштабируемых и поддерживаемых приложений может быть значительным вызовом, особенно при работе с большими кодовыми базами и несколькими сервисами. К счастью,...
habr.com