Веб-приложение Linux Azure не может найти файлы ресурсов, приложение React

Я развертываю приложение React в веб-приложении Azure в Linux. Нода v20. На локалке все работает нормально. Конвейер выпуска работает хорошо. Я даже удалил файлы через scm.azurewebsites.net/webssh/host и повторно развернул, все работает. Но когда я пытаюсь перейти к своему приложению, оно не загружается. Кажется, что сайт новый, со страницей презентации Microsoft.

Затем я попытался просмотреть расширенные инструменты -> сайт wwwroot, но вместо файлов отчетов в каталоге wwwroot попытался загрузить мое приложение с двумя ошибками в консоли инструментов разработки браузера:

mysite.scm.azurewebsites.net/assets/index-Taz5NJvN.js net::ERR_ABORTED 404 (не найден)

это папка wwwroot

Я заметил, что он загружает index.html, потому что он меняет заголовок веб-страницы на заголовок моего приложения.

Я проверил каталог /wwwroot через Azure -> инструменты разработки ->ssh, и каталог ресурсов содержит эти файлы.

Я искал и гуглил, но безуспешно. я использовал pm2 serve /home/site/wwwroot --no-daemon --spa и npx serve -s в команде запуска также указано, что приложение было создано с помощью Vite. Буду признателен, если кто-нибудь поможет мне запустить это приложение.

Можете ли вы предоставить поток журналов вашей службы приложений Azure?

Sirra Sneha 12.06.2024 04:04

Если возможно, можете поделиться своим кодом?

Sirra Sneha 12.06.2024 04:05

спасибо за ваш подробный ответ, Сирра. Расскажите, пожалуйста, какой метод развертывания вы использовали.

Gerardo Monroy González 12.06.2024 18:08

Я использую конвейеры Azure Devops, но начну с нуля и буду следовать вашим указаниям.

Gerardo Monroy González 12.06.2024 18:46

пришлось развернуть из окна рабочей области в коде vs

Gerardo Monroy González 12.06.2024 18:54

Теперь я пытаюсь выполнить развертывание еще раз и получаю сообщение: Смещение центрального каталога не может храниться в Int64. ошибка

Gerardo Monroy González 12.06.2024 19:09

Я развернул приложение через расширение кода Visual Studio.

Sirra Sneha 12.06.2024 19:40

мой сайт жив! спасибо, Сирра. Теперь я подключил центр развертывания в Azure и он работает.

Gerardo Monroy González 12.06.2024 20:43

Рад, что это помогло!

Sirra Sneha 12.06.2024 20:49
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
9
85
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я создал образец приложения vite+react.

Обязательно создайте приложение перед его развертыванием в службе приложений Azure.

npm run build

После запуска вышеуказанной команды создается папка dist , Он содержит все необходимое для развертывания вашего приложения в службе приложений Azure.

  • После развертывания приложения в службе приложений Azure даже я столкнулся с той же проблемой с вашей командой запуска.

  • Я настроил следующую команду запуска в разделе «Конфигурация» веб-приложения Azure.

pm2 serve /home/site/wwwroot/dist --no-daemon --spa

  • Вы можете найти развернутые файлы в KUDU.

Вывод после развертывания:

Другие вопросы по теме