Angular/Vue 部署 IIS 刷新 404 的解決方案

在 Angular 或 Vue 部署到 IIS 上會遇到的問題，不能刷新，一刷新就會出現404，其原因就是自定義路由，下面我們來將這個問題解決。

1.從 IIS “獲取新的 Web 平臺組件”

2.進入 iis.net 官方網站去下載 WebPlatformInstaller_x64_en-US.msi 擴展程序。整個安裝過程只需要點 Install 即可，無需配置。

3.再次點擊“獲取新的 Web 平臺組件”時會彈出擴展組件管理界面。

4.加載完成後出現擴展管理界面，通過右上方的搜索框搜索“重寫”，英文版系統搜索“rewrite”，然後點擊添加即可。如圖本地目前已成功添加。

安裝完成後可將下載的 rewrite_amd64.msi 文件保存起來，以後在新環境中直接運行安裝 rewrite_amd64.msi 就能解決了，擴展管理組件並不是必要條件。

5.重寫擴展組件安裝完成，最後將 web.config 添加進去就能愉快的刷新了。

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="AngularJS" 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>

將 web.config 放到 IIS 根目錄即生效。可將該文件添加至解決方案，這樣每次發佈時就能自動打包，這樣會剩下一些煩惱。