Для деплоя Vite-проекта на GitHub Pages (gh-pages) необходимо выполнить несколько шагов. Во-первых, убедитесь, что у вас уже есть аккаунт на GitHub и создан репозиторий с вашим проектом.
Шаг 1: Установка пакета gh-pages
npm install gh-pages --save-dev
Шаг 2: В файле package.json добавьте скрипты для деплоя:
"scripts": {
"deploy": "vite build && gh-pages -d dist",
"predeploy": "rm -rf dist"
}
Скрипт deploy сначала собирает проект с помощью Vite, а затем запускает команду gh-pages, указывая путь к директории сборки (-d dist). Скрипт predeploy предварительно удаляет директорию dist, чтобы убедиться, что при каждом деплое не осталось предыдущих файлов.
Шаг 3: Создайте ветку gh-pages и опубликуйте на ней дистрибутивные файлы вашего проекта:
git checkout -b gh-pages git subtree push --prefix dist origin gh-pages
Команда git checkout -b gh-pages создает новую ветку gh-pages. Затем команда git subtree push --prefix dist origin gh-pages публикует содержимое директории dist на ветку gh-pages в вашем репозитории.
Шаг 4: Проверьте настройки в репозитории
На странице вашего репозитория на GitHub откройте раздел "Settings", пролистайте вниз до раздела "GitHub Pages". Здесь укажите ветку gh-pages в качестве источника.
После этого, GitHub выполнит деплой вашего Vite-проекта на gh-pages и предоставит вам ссылку на опубликованный сайт. Обратите внимание, что после каждого обновления вашего проекта, необходимо повторить шаги 3 и 4 для актуализации развернутой версии на GitHub Pages.
Изложенный выше подход является одним из способов деплоя Vite-проекта на GitHub Pages. Существуют и другие подходы, такие как использование GitHub Actions для автоматического деплоя или использование специальных библиотек и инструментов для деплоя на статический хостинг.