reactjs - 部署成功仍会进入默认页面

Question

我按照三个不同教程的内容将稍作修改的样板 React 应用程序部署到 Azure 应用服务。我遇到的主要问题是，虽然所有部署管道和版本都在 Azure DevOps 上成功，但导航到该页面会导致未部署的应用程序服务的默认登录页面；

Hey, Node developers!Your app service is up and running.Time to take the next step and deploy your code.

我将简要描述我为达到这一点所采取的步骤:

1. 我使用 create-react-app 生成了一个基本模板，运行了所有必备命令，摆弄了 app.js 文件及其 CSS 配套文件，然后离开了索引。*未受影响。
2. 我将所有内容以未修改的 gitignore 方式推送到了 Github 存储库。
3. 我创建了一个应用服务，运行 Linux 和 Node 12 LTS，采用免费套餐。
4. 我创建了一个 DevOps 项目，并在其中创建了一个管道和一个发布管道。
5. 在管道中:我在“获取源”步骤中通过链接帐户检索了我的存储库源。在代理作业 1 中，我添加了一个 npm install 元素、一个 npm run build 元素和一个 Publish Artifact 元素。我将路径设置为 build，并将工件名称设置为 artifact，发布到 Azure Pipelines。
6. 在发布管道中:我添加了一个工件，该工件从之前的管道中获取其源代码，并提供源别名 _artifact。 CD 触发器已启用。我添加了一个具有部署 Azure 应用服务元素的阶段，使用 $(System.DefaultWorkingDirectory)/_artifact/artifact 作为包/文件夹。

当我推送提交或手动触发第一个管道时，一切都会成功，没有明显的错误。发布管道被触发并且也完成且没有错误。检查日志，artifact 已准确存储和访问。我可以看到正在访问正确的构建文件。

在 Azure 门户中，我可以看到部署已成功，并且具有正确的时间戳、提交名称和管道。但是，当我访问实际网站时，我会看到通用页面。

我是否遗漏了某个关键步骤？我尝试导航到/index.html、/src/index.html 以及一堆其他已知文件的组合，但无济于事； 无法获取/index.html。

如有任何见解，我们将不胜感激。

作为引用，我使用了这三个演练:

• https://medium.com/microsoftazure/deploying-create-react-app-as-a-static-site-on-azure-dd1330b215a5
• https://medium.com/@to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321
• https://www.pluralsight.com/guides/deploy-a-react-app-to-azure

Answer 1

这个问题很简单，可以引用下面的帖子。

1. Deploy create-react-app with azure pipelines

2. Unable to deploy React JS application on Azure App service

3. Process for React App deployment to Azure Web?

建议:

1. 创建Web应用时建议选择Linux。

2. 配置->启动命令: pm2 服务/home/site/wwwroot --no-daemon --spa