View source for React Route Fails in IIS

[[Category:React]]
[[Category:IIS]]

== Step 1 ==
Install [https://www.iis.net/downloads/microsoft/url-rewrite URL Rewrite] extension. The chances that your VM is a x64 one are high, so click “View additional downloads” below “Install this extension”. I don’t know why Microsoft is assuming that you’ll be using x86 architectures. Bad User Experience. Anyway … restart IIS Server.
== Step 2 ==
<pre class="brush:xml;">
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="Static Assets" stopProcessing="true">
          <match url="([\S]+[.](html|htm|svg|js|css|png|gif|jpg|jpeg))" />
          <action type="Rewrite" url="/{R:1}"/>
        </rule>
        <rule name="ReactRouter Routes" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <!-- <add input="/booking" matchType="IsDirectory" negate="true" /> -->
          </conditions>
          <action type="Rewrite" url="/index.html" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
</configuration>
</pre>
== Step 3 ==
* Create a folder called '''iisConfig''' in the project root (not part of the src). 
* Inside there put the web.config file 
* Create a new file '''copyIISConfig.js'''
* Put the code below to '''copyIISConfig.js'''
<pre class="brush:js;">
const fs = require('fs-extra');

const webConfigPath = './build/web.config';

if (fs.existsSync(webConfigPath)) {
    fs.unlinkSync(webConfigPath);
}

fs.copySync('./iisConfig/web.config', webConfigPath);
</pre>
== Step 4 ==
In the package.json file inside the scripts part add the additional build step on the postbuild event:
 "postbuild": "node iisConfig/copyIISConfig.js"