reactjs - 成功部署仍然会导致默认页面
问题描述
我按照三个不同教程的内容将一个稍作修改的样板 React 应用程序部署到 Azure 应用程序服务。我遇到的主要问题是,虽然所有部署管道和发布都在 Azure DevOps 上成功,但导航到该页面会导致未部署应用服务的默认登录页面;
嘿,Node 开发人员!您的应用服务已启动并正在运行。是时候采取下一步行动并部署您的代码了。
我将简要描述我为达到这一点所采取的步骤:
- 我曾经
create-react-app
生成一个基本模板,运行所有必备命令,摆弄app.js文件及其 CSS 伴侣,并保持index.*不变。 - 我用一个未改动的gitignore将所有内容推送到 Github 存储库。
- 我在免费计划中创建了一个运行 Linux 和 Node 12 LTS 的应用服务。
- 我创建了一个 DevOps 项目,并在其中创建了一个 Pipeline 和一个 Release Pipeline。
- 在管道中:我在获取源步骤中通过链接帐户检索了我的存储库源。在代理作业 1 中,我添加了一个
npm install
元素、一个npm run build
元素和一个 Publish Artifact 元素。我将路径设置为build
,并将工件名称设置为artifact
,发布到 Azure Pipelines。 - 在 Release Pipeline 中:我添加了一个工件,该工件从先前的管道中获取其源,并提供了一个源别名
_artifact
. CD 触发器已启用。我添加了一个具有 Deploy Azure App Service 元素的阶段,$(System.DefaultWorkingDirectory)/_artifact/artifact
用作包/文件夹。
当我推送提交或手动触发第一个管道时,一切都会成功,没有明显的错误。发布管道被触发,并且也没有错误地完成。检查日志,artifact
准确存储和访问。我可以看到正在访问的正确构建文件。
在 Azure 门户中,我可以看到部署已成功,并具有正确的时间戳、提交名称和管道。但是,当我访问实际站点时,会显示通用页面。
我是否错过了某个关键步骤?我尝试导航到 /index.html、/src/index.html 和一堆其他已知文件的组合,但无济于事;Cannot GET /index.html
.
任何见解将不胜感激。
作为参考,我使用了这三个演练:
解决方案
这个问题很简单,可以参考下面的帖子。
1. 使用 azure 管道部署 create-react-app
2. 无法在 Azure App 服务上部署 React JS 应用程序
3. React App 部署到 Azure Web 的流程?
建议:
建议在创建 webapp 时选择 linux。
Configuration
->StartupCommand:
pm2 serve /home/site/wwwroot --no-daemon --spa
推荐阅读
- azerothcore - 世界服务器无响应运行
- python - Python 到带有 Java 字节数组的 MQTT
- regex - 下划线和文件扩展名之间的正则表达式字符串提取
- javascript - 我如何创建一个仅包含会员票的新数组
- flutter - 由于 com.facebook.react,Jitsi 遇到颤振构建失败
- reactjs - 如何在反应中在ckeditor 5中添加跟踪更改选项?
- ios - 如何使 SF 符号标签栏项目图像占据整个高度?
- javascript - 为什么 DOMNodeRemoved 事件只起作用一次?
- mysql - “MySQL 错误代码 1114:表已满”不断出现
- java - Google App Engine 中请求线程之间的环境共享