Упростите управление своими репозиториями!

Что такое монорепозиторий?

Когда я впервые присоединился к Shutterstock около двух с половиной лет назад, я не знал о проблемах управления репозиторием, в котором работает более 100 человек. Это было мое первое знакомство с концепцией монорепозитория: единственного репозитория, содержащего множество различных проектов. Разговор с моими коллегами о том, как Google управляет миллиардами строк кода в одном репозитории. Идея заключается в том, что централизация кода может привести к более детализированному развертыванию и легкому совместному использованию кода.

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

Предпосылки и планирование

Поскольку монорепозиторий содержит множество приложений, мы начнем с готовой базы, которую я переместил в этот репозиторий. Для подключения нашего монорепозитория к Vercel нам понадобятся следующие инструменты:

  • Аутентифицированный интерфейс командной строки Vercel: вы можете загрузить его здесь и войти в систему, как показано здесь.
  • Yarn для использования рабочих пакетов: вы можете скачать его, как показано здесь.

Как только это будет сделано, вы можете клонировать репозиторий на свой компьютер или разветвить его. После того, как это будет сделано, мы выполним следующие шаги, которые будут объяснены более подробно ниже:

  1. Подключите каждое приложение к Vercel
  2. Делитесь кодом между пакетами
  3. Скрипт нашего монорепозитория

Давайте начнем!

Подключение к Верселю

Vercel рассматривает каждое рабочее пространство как отдельный проект. Это полезно, поскольку каждая часть приложения развертывается самостоятельно. Это ускоряет развертывание, поскольку все они выполняются параллельно. Чтобы настроить это, нам нужно будет подключить Vercel к каждому пакету. Начнем с пакета функций:

Это вызовет пару вопросов, принимая значение по умолчанию, которое в основном будет работать здесь. Как только это будет сделано, мы можем перейти на панель инструментов Vercel и увидеть наш недавно развернутый проект.

Давайте продолжим и сделаем то же самое для приложения React. Запустите эти команды из корня репозитория:

Это будет действительно похожий процесс. Vercel хорошо идентифицирует каждый фреймворк, который он находит, поэтому в основном это будет просто ответ на вопросы, заданные CLI, если вы используете один из основных фреймворков или даже меньший, такой как Svelte.

Общий код между пакетами

После того, как мы подключим все наши приложения к Vercel, мы рассмотрим различные сценарии и способы управления каждым приложением с помощью рабочих пространств Yarn. Первое, что нужно отметить, это то, что рабочее пространство не обязательно должно быть полноценным приложением! Это может быть небольшой модуль Javascript, которым вы хотите поделиться между приложениями! В нашем примере с монорепозиторием мы делаем пакет Theme доступным для других рабочих пространств в разделе packages/theme. Вы можете использовать этот пакет, установив его в другое рабочее пространство следующим образом:

yarn workspace ui add -D @vercel-monorepo/theme

Затем Yarn распознает это как внутренний пакет и будет добавлен как зависимость приложения пользовательского интерфейса. Теперь давайте перейдем к созданию скриптов для нашего монорепозитория.

Скрипты для наших монорепозиториев

В некоторых наших приложениях уже есть скрипты. Например, приложение пользовательского интерфейса было создано с помощью create-react-app, поэтому ему не нужен специальный сценарий разработки Vercel. Нам все еще нужно добавить скрипт развертывания в это приложение в его раздел package.json script:

"deploy": "vercel deploy --prod"

Нам также нужны специальные скрипты Vercel в функциях package.json, так как это будет использовать бессерверные функции Vercel:

"start": "vercel dev",
"deploy": "vercel deploy --prod"

Поскольку внутри монорепозитория потенциально может быть много приложений, может быть полезно добавить в корень package.json несколько скриптов, которые вызывают скрипты, специфичные для пакетов. Мы можем легко сделать это, используя yarn --cwd. Это скажет пряже выполнить скрипт непосредственно из определенной папки. Вот пример:

"start:ui": "yarn --cwd packages/ui start",
"start:functions": "yarn --cwd packages/functions start", "deploy:ui": "yarn --cwd packages/ui deploy",
"deploy:functions": "yarn --cwd packages/functions deploy"

Вывод

Как показывает этот пример, монорепозиторий не должен быть сложным. Рассматривая каждое приложение как отдельный проект Vercel, мы можем сократить время сборки и легко обмениваться кодом между приложениями! Вот несколько выводов:

  • Рабочие пространства Yarn упрощают обмен кодом между пакетами.
  • Добавление сценариев сделает вашу жизнь проще и сэкономит ваше время.
  • Не стесняйтесь делать пакет даже для одного файла, такого как тема! Это не требует усилий и делает код более пригодным для повторного использования.
  • Эта структура монорепозитория упрощает добавление функций Vercel в проект.

Хотите узнать больше? В настоящее время я работаю над курсом, который учит всему о развертывании и создании веб-приложений. Этот курс предназначен для веб-разработчиков и делает весь процесс настолько простым, что вам никогда не понадобится нанимать команду DevOps! Свяжитесь со мной в Твиттере @gbibeaul, если у вас есть какие-либо вопросы.

Первоначально опубликовано на https://frontend-devops.com.