Описание задачи

Вам необходимо создать многоступенчатую сборку для приложения VueJS.

В качестве примера будем использовать https://github.com/amvasilyev/2020-unix-vue-template-app

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

Логика работы данных приложений достаточно простая: есть 1 html-файл, который подгружает несколько JS и CSS-документов. После их загрузки контроль за выполнением приложения берёт на себя JavaScript.

Для того, чтобы скомпилировать данный пример необходимо установить NodeJS и в корне проекта выполнить:

npm ci
npm run build

В результате в проекте появится каталог dist, который будет содержать в себе все статические файлы.

Предложение по реализации

  1. Склонируйте себе репозиторий из примера.
  2. Создайте в корне каталога Dockerfile.
  3. Решите задачу сборки данного приложения:
    1. В образ добавьте NodeJS с последним LTS-выпуском.
    2. Скопируйте в образ файлы package.json и package-lock.json. Эти файлы содержат в себе список зависимостей для работы и компиляции приложения.
    3. Выполните команды из описания задачи.
    4. Удостоверьтесь, что команды выполнились успешно и в каталоге dist находится собранное приложение.
  4. Решите задачу по пакетированию приложения:
    1. Возьмите продуктовый образ Nginx.
    2. Скопируйте в него собранное VueJS-приложение.
    3. Либо используйте настройку по умолчанию, либо добавьте настройку сайта Nginx для раздачи содержимого.
  5. Запустите контейнер на основании данной сборки и убедитесь, что веб-приложение доступно и работает.