本文介绍了是否将React App部署到Azure Web?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我目前正在尝试将默认的React Web应用程序部署到Azure,但遇到一个问题,尽管我将build文件夹的内容部署到了Azure托管的/site/wwwroot文件夹中,但最终却转到了下一页到我的托管地址:

我打算部署默认的create-react-app react应用程序,以便在部署实际站点时可以停止该过程.我所遵循的过程与本文

这时,当我尝试访问Azure站点时,我得到了嘿,Node开发人员!"表示我的代码未部署的页面.关于为什么可能会这样的任何想法?

***我有一种预感,在配置Azure Web Api期间某些东西未正确设置,可能是因为我选择Node 10.14作为运行时堆栈只是因为那是我已安装并正在使用的Node版本.使用我本地的React应用.

谢谢大家的时间.

解决方案

您已经创建了Linux应用服务-您的web.config无法工作,因为没有IIS.

如果您不选择节点作为运行时堆栈,则您的应用程序将在大多数情况下运行,因为它像静态Web主机一样提供文件服务.但是,我建议保留运行时堆栈作为节点,并将以下文件添加到您的部署中的 wwwroot 文件夹中:

ecosystem.config.js

  module.exports = {应用: [{脚本:"npx serve -s"}]}; 

https://burkeknowswords.com/这是如何轻松部署静态站点到azure-96c77f0301ff

I am currently trying to deploy the default react web app to Azure and I am encountering an issue where though I deploy the contents of my build folder to the azure hosted /site/wwwroot folder I end up on the following page when going to my hosted address: https://[project_name].azurewebsites.net/

Landing Page :

I intend to deploy the default create-react-app react application so that I may have the process down for when I deploy my real site.The process I have followed is pretty much exactly what is mentioned in this article https://medium.com/@to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321

  1. Create the default React App with create-react-app
  2. Run "npm run build" to get the build folder
  3. Go into the Azure React Portal and create a new Web App ***
  4. FTP / Git deploy the contents of the local build folder into the Azure website's /site/wwwroot/ folder
  5. For overkill I added the below web.config file to handle future routes, but have also tried without this step

In the end my Azure site's contents look like this

Folder contents :

At this point when I try to access the Azure site I get the "Hey, Node developers!" page which implies my code is not deployed. Any thoughts as to why this might be the case?

*** I have a hunch that during the configuring of the Azure Web Api something is not set up correctly perhaps because I select Node 10.14 as my Runtime stack simply because that is the version of Node that I have installed and am using with my local React app.

Thank you folks for your time.

解决方案

You have created a Linux App Service - your web.config won't work because there is no IIS.

If you don't select node as the runtime stack, your app will work for the most part because it serves the files like a static web host. However I would suggest to keep the runtime stack as node and add the following file to your deployment in the wwwroot folder:

ecosystem.config.js

module.exports = {
    apps: [
        {
            script: "npx serve -s"
        }
    ]
};

https://burkeknowswords.com/this-is-how-to-easily-deploy-a-static-site-to-azure-96c77f0301ff

这篇关于是否将React App部署到Azure Web?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-07 09:49