1

I am busy trying to create a Virtual Directory for a new React Application. I have setup the virtual path and my pipeline does deploy my react to site\wwwroot\portal and the virtual path goes to /portal . That is all working correctly but the issues I am facing is that my react app does not get the content from the \portal directory , it gets it from the parent. So for example:

https://website.azurewebsites.net/static/css/2.f5a801b7.chunk.css

suppose to go to

https://website.azurewebsites.net/portal/static/css/2.f5a801b7.chunk.css

I have added in a basename to be /portal

And I added in a web.config to the react app with the following code:

   <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="portal\/*.*" negate="true" />
           </conditions>
           <action type="Rewrite" url="/portal/" />
        </rule>
     </rules>
  </rewrite>
    </system.webServer>

I also added the following to the parent web.config

<location path="." inheritInChildApplications="false">

But still all my css and js content looks in the parent folder instead of the portal folder. I am using azure app services

UPDATE:

I have tried what is linked in the following but it does not seem to work: How to deploy react to azure virtual directory

Mohammed
  • 66
  • 13
  • Does this answer your question? [How to deploy react application to virtual application in Azure?](https://stackoverflow.com/questions/61335332/how-to-deploy-react-application-to-virtual-application-in-azure) – Ecstasy Mar 25 '22 at 04:22
  • You can refer to [Azure - Static HTML/CSS/JS as Virtual directories in Web apps](https://stackoverflow.com/questions/42736545/azure-static-html-css-js-as-virtual-directories-in-web-apps), [How to replace %PUBLIC_URL% in react app on an azure website](https://stackoverflow.com/questions/53225426/how-to-replace-public-url-in-react-app-on-an-azure-website) and [Azure AppService NodeJs with virtual directory](https://stackoverflow.com/questions/54445453/azure-appservice-nodejs-with-virtual-directory) – Ecstasy Mar 25 '22 at 04:24

0 Answers0