Как исправить проблему отображения(белый экран) Vue приложения при деплое через Vite на Github Pages?

Question

[danyavodichev]

Возникла проблема при развёртывании Vue приложения с помощью сборщика Vite на Github Pages. При переходе по ссылке GH Pages передо мной появляется чисто белый экран. Стоит отметить что через команду "npm run dev" всё выглядит и работает превосходно. До этого был опыт деплоя приложения на нативном JS через Vite, проблем не наблюдалось. Если необходимо предоставить какую-то информацию, готов связаться с вами или написать в комментариях. Очень надеюсь на помощь. Прикрепляю ссылки на репозиторий и GH Pages:
https://github.com/yoursAniki/Form-Builder-App
https://yoursaniki.github.io/Form-Builder-App/

Дополнение:
Сейчас обнаружил следующие ошибки при попытке запустить index.html в папке dist

Answer 1

[Александр]

Настройте конфиг https://vitejs.dev/guide/static-deploy.html#github...

Comments

[danyavodichev]

Вроде сделал все по инструкции, но по-прежнему проблема та же

[Александр]

danyavodichev, вижу что откатили изменения, следовательно проверять не имеет смысла. Конфиг должен выглядеть таким образом:

export default defineConfig(({ command }) => ({
  base: command === "build" ? "/REPO-NAME/" : "/",
  plugins: [vue(), vueJsx()],
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
  },
}));

[danyavodichev]

Александр, сделал так, как вы написали, а во вкладке github pages, нужно указывать source: "deploy from the branch" или "github actions"? и что еще необходимо сделать?

[danyavodichev]

Александр, на данном этапе у меня уже на вкладке видна favicon (значит пути указаны правильно), но при этом все равно чисто белый экран https://yoursaniki.github.io/Form-Builder-App/

[Александр]

danyavodichev, замените createWebHistory на createWebHashHistory в src/main.js.

[danyavodichev]

Александр, заменил, пересобрал проект, пока все так же белый экран

[danyavodichev]

Александр, все, теперь начало работать, спасибо большое)