Как развернуть проект angular 7 непосредственно на моем веб-сервере, чтобы я не перенес свою папку dist всегда после развертывания?

Question

В настоящее время я развертываю свой проект Angular 7 с помощью FileZilla для переноса моих локальных файлов из папки ./dist на сервер public_HTMl. Это довольно трудоемкая задача, которую нужно выполнять ежедневно, поэтому я хочу развернуть свой код непосредственно на сервере, когда я нажимаю ng build --prod, тогда эти скомпилированные файлы должны быть перенесены непосредственно на сервер. Кто-нибудь здесь, кто может помочь мне решить эту проблему?

Чтобы избавиться от этой проблемы, я перепробовал много шагов:

Я использовал конвейеры bitbucket для выполнения своего кода, это оказалось дорогостоящим, и я тоже не могу его запустить. Это заняло несколько часов, но не может дать вывод для меня.

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

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

Answer 1

Вы можете сделать это простым способом. Создайте базовый bash/sh скрипт или windows executable и используйте rsync , чтобы сделать это автоматически:

deploy.sh:

#!/bin/bash
ng build --prod
rsync -arvt ./dist remoteuser@remotehost:/var/www/remotedirectory

Чтобы не вводить логин и пароль каждый раз, добавьте открытый ключ RSA на удаленный компьютер (доверенный хост). Вы можете объединить это решение с Bitbucket pipelines, когда бесплатный план заканчивается, я запускаю этот скрипт вручную со своего компьютера разработчика.

Bitbucket-pipelines.yml:

image: mycustomimage:latest
pipelines:
  default:
    - step:
        name: Build and deploy to production
        caches:
          - node
        deployment: production
        script:
          - npm install
          - npm install -g @angular/cli 
          - ng config -g cli.warnings.versionMismatch false
          - ./deploy.sh

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

Самое простое решение - всегда лучшее:)