Непрерывно развернут свой фронт с помощью Gitlab и Scotty. JS

Моя любовь для Gitlab продолжается! Вот быстрый пост, показывающий вам, как постоянно развернуть свои приложения React/Vue/угловую единую страницу на S3 и Cloudfront, используя только Docker, Gitlab и отличный инструмент под названием Скотти. JS Отказ

Первое сохранение AWS_ACCESS_KEY_ID и Aws_secret_access_key к вашим переменным среды Gitlab (я рекомендую специальную роль IAM для этого). Затем сохраните файлы ниже в свой репозиторий и обновите текст заполнителя на то, что имеет смысл для вашего проекта.

Ниже подключения выполняет многоступенчатую сборку, которая создает код Frontend (Create-React-App), затем копирует все это в каталог, который может получить доступ к SCOTTY.

#Dockerfile
FROM node:8.11.3-slim as node_builder

MAINTAINER @iMichael

WORKDIR /app

COPY /src  /app/src

RUN cd /app/src && \
    npm install && \
    npm run build

FROM node:8.11.3-slim as deployer

RUN groupadd -r react && useradd -r -g react react

RUN npm install scottyjs --global

COPY --from=node_builder /app/src/build /tmp/build

USER react

ENTRYPOINT ["scotty"]

И ниже — конфигурация GitLab, которая связывает все вместе. Обновите это с помощью любой специальной логики, которой придерживается ваша команда (например, развертывание, только если все тесты проходят в главном филиале).

#.gitlab-ci.yml
image: docker:latest

services:
  - docker:dind

stages:
- build
- push
- deploy

variables:
  REACT_TAG_NAME: registry.gitlab.com///:$CI_COMMIT_REF_NAME
  S3_BUCKET: xxxx

before_script:
  - docker login -u gitlab-ci-token -p $CI_JOB_TOKEN registry.gitlab.com

build:react:
  artifacts:
    paths:
      - docker-images
  stage: build
  script:
    - mkdir docker-images
    - docker build --pull -t $REACT_TAG_NAME -f path/to/your/Dockerfile .
    - docker save $REACT_TAG_NAME > docker-images/react.tar

push:react:
  stage: push
  script:
    - docker load -i docker-images/react.tar
    - docker push $REACT_TAG_NAME
  only:
    - master

deploy:react:
  stage: deploy
  script:
    - docker run \
      --rm  \
      -e AWS_ACCESS_KEY_ID=$AWS_ACCESS_KEY_ID \
      -e AWS_SECRET_ACCESS_KEY=$AWS_SECRET_ACCESS_KEY  \
      $REACT_TAG_NAME  \
      --source /tmp/build/ \
      --region us-east-1 \
      --bucket $S3_BUCKET \
      --spa

Теперь каждый раз, когда вы нажимаете на Master на GitLab (и все тесты Pass). Ваш код будет развернут для AWS с URL Cloudfront, который вы можете CNAME на свой собственный домен.

Большое спасибо Scotty.js, который делает всю тяжелую работу!

Оригинал: «https://dev.to/imichael/continuously-deploy-your-frontend-using-gitlab-and-scottyjs—15j8»