Как опубликовать приложение, созданное на Vue и Vite, на GitHub Pages?

Как можно исправить проблему с отображением пустой белой страницы и появлением символа "/>" в левом верхнем углу при запуске проекта с помощью GitHub Pages?
  • 21 июля 2024 г. 22:02
Ответы на вопрос 2
Чтобы опубликовать приложение, созданное на Vue и Vite, на GitHub Pages, вам следует выполнить следующие шаги:

1. Используйте команду `vite build` для сборки вашего приложения перед публикацией. В результате будет создана папка `dist` с минимизированным и оптимизированным кодом приложения.

2. Создайте новый репозиторий на GitHub, загрузите в него папку `dist` с собранным приложением.

3. Перейдите на страницу настроек вашего репозитория, найдите раздел GitHub Pages и выберите ветку, содержащую приложение (обычно это `main` или `master`). Укажите папку, где находится ваше приложение (`dist`).

4. После этого ваше приложение будет доступно по адресу `https://ваше_имя_пользователя.github.io/название_репозитория`.

Чтобы исправить проблему с отображением пустой белой страницы и появлением символа "/>" в левом верхнем углу при запуске проекта с помощью GitHub Pages, вам следует убедиться, что все пути к ресурсам (файлы стилей, скрипты, изображения и т.д.) в вашем приложении указаны правильно и относительно корня сайта.

Также возможно, что проблема связана с настройками маршрутизации в вашем приложении Vue. Если вы используете роутер Vue, убедитесь, что правильно настроили базовый путь (`base`) для вашего приложения, чтобы он соответствовал пути, по которому размещено приложение на GitHub Pages.

Если проблема не устраняется, рекомендуется также просмотреть консоль разработчика в браузере для поиска ошибок и сообщений, которые могут помочь выявить причину проблемы.
На Github Pages можно выложить только фронт. Бэк должен работать на вашем сервере.
Похожие вопросы