git - 使用 create-react-app 在 azure 上部署

Question

我正在使用 create-react-app 来开发我的 React 应用程序。现在我想在云上发布 bundle 。所以我这样做了:

npm run build

它创建了一个 build 文件夹，我在其中初始化了一个存储库:

git init

然后添加原点

git remote add origin https://mysiteonazure.com/app.git

终于提交并推送了文件。所以我能够查看我的应用程序。当我想使用 URL 进行导航时，问题出现了，因此转向:

http://mysiteonazure.com/login

没用。

所以我来到了下面这篇文章Deploying create-react-app on Microsoft Azure

所以我的构建有:

build-azure
|_.git
|_static
|_asset-manifest-json
|_favicon.ico
|_index.html

现在我添加了web.config

build-azure
|_.git
|_static
|_asset-manifest-json
|_favicon.ico
|_index.html
|_web.config

与:

<?xml version=”1.0"?>
<configuration>
 <system.webServer>
 <rewrite>
 <rules>
 <rule name=”React Routes” stopProcessing=”true”>
 <match url=”.*” />
 <conditions logicalGrouping=”MatchAll”>
 <add input=”{REQUEST_FILENAME}” matchType=”IsFile” negate=”true” />
 <add input=”{REQUEST_FILENAME}” matchType=”IsDirectory” negate=”true” />
 <add input=”{REQUEST_URI}” pattern=”^/(api)” negate=”true” />
 </conditions>
 <action type=”Rewrite” url=”/” />
 </rule>
 </rules>
 </rewrite>
 </system.webServer>
</configuration>

但是现在当我进入主页:http://mypage.azurewebsite.net 我得到:

The page cannot be displayed because an internal server error has occurred.

如何解决这个问题？或者，如何正确发布我的应用程序？

Answer 1

鉴于详细信息，问题在于引号，我从给定源复制了 web.config，它还有其他引号，所以真正的 web.config > 是:

<?xml version="1.0"?>
<configuration>
 <system.webServer>
 <rewrite>
 <rules>
 <rule name="React Routes" stopProcessing="true">
 <match url=".*" />
 <conditions logicalGrouping="MatchAll">
 <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
 <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
 <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
 </conditions>
 <action type="Rewrite" url="/" />
 </rule>
 </rules>
 </rewrite>
 </system.webServer>
</configuration>