Angular RouterアプリケーションをAzure Web Appsにデプロイして動かす

背景

Angular Routerとは

Angular2からリリースされた機能で、アプリケーションの状態を宣言的に特定することができ、コンポーネントとURLがリンクされる。Single Page Applicationでありながら通常のWebページと同様に特定のWebページに直接アクセスすることもできる。

やりたいこと

ng serveやnpm startでローカル開発したものAzure App ServiceのWeb Appsにデプロイして公開したい。

問題

ローカルの開発環境では問題なくルーティングできているのに、Web Appsにデプロイすると以下のような挙動になってしまう。

• F5でリロードした時に"The resource you are looking for has been removed, had its name changed, or is temporarily unavailable."という404的なメッセージが表示される。
• 特定のコンポーネント（にリンクされたページURL）を直接表示しようとすると、やはり上記の404的なメッセージが表示される。

対応

web.configに設定追加

アプリケーションroot直下のweb.configファイルに以下設定を追加することでローカルと同様の挙動となることを確認できた。

<configuration>
    <system.webServer>
        <rewrite>
          <rules>
            ...省略...

            <rule name="Index Rule" stopProcessing="true">
                <match url=".*" />
                <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                </conditions>
                <action type="Rewrite" url="/index.html" />
            </rule>

            ...省略...
            </rules>
        </rewrite>
    </system.webServer>
    ...省略...
</configuration>

Azureに限らず普通にIISにデプロイする場合や、他のPaaSにデプロイする場合でも同様のことが起こるかもしれないが、試していない。
どなたか分かる方がいれば教えてください。