Dealing with 404 error on IIS for a vite app

Question

I have successfully ran npm run build & copied the dist folder contents to my intetpub/wwwroot/sitename. The landing page is displayed and was able to navigate to another page with router.push(...). The problem is whenever I reload any page, other than the landing page or click on any navigation link, I get error 404.

I have even added a web.config with the content below, still getting 404.

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="Handle History Mode and custom 404/500" 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>
        <httpErrors>
            <remove statusCode="404" subStatusCode="-1" />
            <remove statusCode="500" subStatusCode="-1" />
            <error statusCode="404" path="/notfound" responseMode="ExecuteURL" />
            <error statusCode="500" path="/error" responseMode="ExecuteURL" />
        </httpErrors>
        <modules runAllManagedModulesForAllRequests="true"/>
    </system.webServer>
</configuration>

In fact, I have changed <action type="Rewrite" url="/" /> to <action type="Rewrite" url="/index.html" />. In fact, I have installed URL Rewrite extension but still getting 404.

What am I doing wrongly?

** Updates **

I got it fixed eventually by restarting the webserver.

Answer 1

try to add this content to your web.config file:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>         
      <rewrite>
           <rules>
                <rule name="DynamicContent">
                     <conditions>
                          <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/>
                     </conditions>
                     <action type="Rewrite" url="index.html"/>
                </rule>
           </rules>
      </rewrite>
   </system.webServer>
</configuration>