www.example.com/tab is not working when deployed

Question

Hi I'm new to teams development. So I created an app ang tried it in teams via the localhost:3000, it is working fine.

But when I deployed the app to my azure the /tab and /config is not working. Do I have a problem in code? deployment? or do I need to configure something in my webserver?

Edit:
when I try to go to www.example.com/tab this is what it returns:

The resource you are looking for has been removed, had its name changed, or is temporarily unavailable.

Answer 1

Hi, I fixed this problem by:

Creating a web.config file in public folder that contains:

<?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>

Then npm run build
lastly, deploy the build folder.