成功部署仍然会导致默认页面 [英] Successful deployment still leads to default page

问题描述

在将稍作修改的样板React应用程序部署到Azure App Services时，我遵循了三个不同教程的内容.我遇到的主要问题是，虽然所有部署管道和发行版在Azure DevOps上均成功完成，但导航到该页面会导致未部署的应用程序服务的默认登录页面；

I followed the contents of three different tutorials in deploying a slightly-modified boilerplate React app to Azure App Services. The primary issue I'm having is that while all deployment pipelines and releases have been successful on Azure DevOps, navigating to the page results in the default landing page for non-deployed app services;

嘿，Node开发人员！您的应用程序服务已启动并正在运行.是时候采取下一步并部署代码了.

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

我将简要介绍为达到这一点而采取的步骤:

I'll briefly describe the steps I took to get to this point:

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触发器已启用.我添加了一个具有Deploy Azure App Service元素的阶段，使用 $(System.DefaultWorkingDirectory)/_ artifact/artifact 作为包/文件夹.

1. I used create-react-app to generate a basic template, ran all the prerequisite commands, fiddled with the app.js file and its CSS companion, and left index.* untouched.
2. I pushed all of it with an untouched gitignore to a Github repository.
3. I created an App Service, running Linux and Node 12 LTS, on the Free plan.
4. I created a DevOps project, and within it created a Pipeline and a Release Pipeline.
5. In the Pipeline: I retrieved my repository source via linked accounts in the Get Sources step. In Agent job 1, I added a npm install element, a npm run build element, and a Publish Artifact element. I set the path to build, and artifact name to artifact, publishing to Azure Pipelines.
6. In the Release Pipeline: I added an artifact that grabs its source from the previous pipeline, and gives a source alias of _artifact. CD trigger is enabled. I added a stage that has a Deploy Azure App Service element, using $(System.DefaultWorkingDirectory)/_artifact/artifact as the package/folder.

当我推动提交或手动触发第一个管道时，一切成功，没有明显的错误.Release管道将被触发，并且也将完成而不会出现错误.检查日志后， artifact 会被正确存储和访问.我可以看到正在访问的正确的构建文件.

When I push a commit or manually trigger the first pipeline, everything succeeds with no obvious errors. The Release pipeline is triggered and also completes without error. Checking the logs, the artifact is stored and accessed accurately. I can see the correct build files being accessed.

在Azure门户中，我看到正确的时间戳，提交名称和管道已成功部署.但是，当我访问实际站点时，会看到通用页面.

In the Azure portal, I can see that deployment has succeeded with the correct timestamp, commit name, and pipelines. However, when I access the actual site, I am shown the generic page.

我在某个地方错过了关键步骤吗?我尝试导航到/index.html、/src/index.html以及其他一系列已知文件的组合，但无济于事；无法获取/index.html.

Am I missing a crucial step somewhere? I've tried navigating to /index.html, /src/index.html, and a bunch of other combinations of known files, but to no avail; Cannot GET /index.html.

任何见识都会受到赞赏.

Any insight would be appreciated.

作为参考，我使用了以下三个演练:

For reference, I used these three walkthroughs:

• 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

推荐答案

这个问题非常简单，您可以参考以下文章.

This question is very simple, you can refer to the following post.

1.使用Azure管道部署create-react-app

2.无法在Azure App服务上部署React JS应用程序

3.将React App部署到Azure Web的过程?

建议:

1. 建议在创建Web应用程序时选择linux.

1. It is recommended to choose linux when creating a webapp.

配置-> StartupCommand: pm2 serve/home/site/wwwroot --no-daemon --spa

这篇关于成功部署仍然会导致默认页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！