Error HTTP 500.19 - Internal Server Error while deploying angular app in IIS

Question

I have a problem when deploying my Angular app on IIS, I added the config file "web.config", and granted the permissions to the users:

<?xml version = "1.0" encoding = "UTF-8" ?>
<configuration>
    <system.webServer>
      <rewrite>
        <rules>
          <rule name="Angular Routes" stopProcessing="true">
            <match url=".*" />
            <conditions logicalGrouping="MatchAll">
              <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
              <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
            </conditions>
            <action type="Rewrite" url="/" />
          </rule>
        </rules>
      </rewrite>
    </system.webServer>
</configuration>

but I keep getting this error:

If I remove the web.config file it works but not completely, I still get the 404 error in the Api calls and when I reload the page.

Edited here:

Additional information:

here is the bad 404 error that I get when removing we.config:

this is the app.config.json:

{
  "apiUrl": "my_back_end_deplyment_Url",
  "dashboardUrl": "/",
  "theme": "theme-green",
  "notificationRefreshInterval": 900000,
  "maxNotificationToTake": 10,
  "useNotifications": false,
  "useDashboard": false,
  "intervalConnectionCheck": 300000
}

Am I messing something else (maybe to link the angular app to my .NET Core app) ?

Answer 1

It appears that UrlReWrite is necessary for this process, I couldn't install it in the beginning because of restrictions put by the company (security issues). After it was installed it worked just fine.