vue-router history 模式 iis 多层目录配置问题

Question

目前：
localhost:80/index
localhost:80/login
这类页面都没有问题，刷新当前页可以显示对应页面；

web.config

<?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>
  </system.webServer>
</configuration>

但是当目录有2层的时候，就会出现页面空白
例如：
localhost:80/index 可以通过菜单跳转到 localhost:80/list/page,
页面能正常显示，但是刷新当前页面，就空白了
控制台报错：Uncaught SyntaxError: Unexpected token <

Answer 1

已解决.
webpack.prod.config.js
publicPath:'http://.....'
写服务器地址就好了

Answer 2

我同样遇到这个问题

实际访问的Url: http://127.0.0.1/Dev/Web/

我的解决方式:

1. 先安装以下IIS插件 下载
2. 配置Web.config
3. 修改vue代码router

//eb.config
<?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="./index.html" />
                </rule>
            </rules>
        </rewrite>
        <httpErrors>     
            <remove statusCode="404" subStatusCode="-1" />                
            <remove statusCode="500" subStatusCode="-1" />
            <error statusCode="404" path="/survey/notfound" responseMode="ExecuteURL" />                
            <error statusCode="500" path="/survey/error" responseMode="ExecuteURL" />
        </httpErrors>
        <modules runAllManagedModulesForAllRequests="true" />
    </system.webServer>
</configuration>

//vue main.js代码
export const router = new VueRouter({
    mode: 'history',
    base: '/Dev/Web/',
    routes:[{
        path: '/index.html',
        component: login
    },{
        path: '*',
        component: P404
    }]
});