Я использую webpack для объединения всех моих файлов JS, HTML и CSS. В то время как webpack может упаковывать, он не предоставляет никакого инструмента (здесь я могу ошибаться) для фактического создания архива выходной папки (в моем случае это был dist), а также для развертывания его на удаленном компьютере. сервер (я использую артефактный сервер для хранения своих пакетов).

Итак, вот как я это сделал:

  1. создал новый сценарий оболочки deploy.sh в корне проекта
touch deploy.sh

2. Получите версию своего приложения из package.json, используя node -p.

#!/bin/bash

#Get app version

APP_VERSION=$(node -pe "require('./package.json').version")

3. Создайте архив папки dist с помощью команды tar.

#create a name for your bundle
ARCHIVE_NAME='app-name-'$APP_VERSION'.tar.gz'
#create an archive 
tar -czvf $ARCHIVE_NAME -C ./dist .

здесь -C гарантирует, что вы заархивируете содержимое каталога dist, но не сам каталог dist.

4. развернуть это (скопировать архив) на удаленный сервер с помощью curl

#deploy to remote server
curl -u username:password -X PUT "http://jenkins.myserver.com:8081/artifactory/libs-release-local/com/myserver/myproject/$APP_VERSION/$ARCHIVE_NAME" -T ./$ARCHIVE_NAME

Полный сценарий оболочки выглядит так:

Теперь вызовите этот скрипт из ваших npm-скриптов в файле package.json:

...
scripts: {
    "deploy": "./deploy.sh"
}

Вот и все! теперь беги

npm run deploy

и посмотрите, как ваше приложение развернуто на удаленном сервере!