Question

更新

进一步研究之后，我认为该问题与以下事实有关：引用诸如CSS文件之类的资产。 href =“ / css / style.css” IIS将通过导航到服务器的根文件夹而不是应用程序的根文件夹来解决该问题，例如本地主机/myapp/css/style.css。但是，它似乎仅在运行Vue应用程序时发生，当我在其自己的应用程序中“部署”原始html文件时，CSS和JS文件路径已正确解析。

原始帖子

我已经使用vue-router在Vue.js中开发了一个示例待办事项应用程序。当使用VUE CLI进行服务时，它可以按预期工作，但是当我从IIS应用程序的dist文件夹中构建文件并将其放入IIS应用程序时，出现了错误，指示服务器试图在以下位置找到资产文件（例如CSS和JS）本地主机根目录，而不是本地主机/ todos。错误示例：

 http://localhost/css/app.45a2082d.css net::ERR_ABORTED 404 (Not Found)
 http://localhost/js/app.34c2e8cc.js net::ERR_ABORTED 404 (Not Found)

我遵循了在官方网站上为here指定的IIS的步骤，即安装了IIS UrlRewrite并包含了web.config，但是我得到了相同的结果。包含的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>

作为一种解决方法，我尝试创建一个新的ASP.Net核心应用程序。我将所有构建的资产文件（包括index.html）放在wwwroot文件夹下，并将以下中间件添加到Startup.cs中：

app.UseFileServer();
app.Run(async (context) => {
    await context.Response.SendFileAsync(env.ContentRootPath + "/wwwroot/index.html");
});

当通过IIS Express启动时，它可以按预期工作，即，它加载了index.html文件，该文件又正确地加载了所有其他资产。由于我可以在页面/路线（“首页”和“关于”）之间进行切换，因此路线正常工作。但是，当我发布此Web应用程序并将其与更新的web.config文件（上述URL重写规则+ .Net Core特定配置）一起放在IIS下时，我遇到了相同的问题-IIS似乎尝试从根目录加载资产本地主机位置。

如何告诉IIS在应用程序的根目录（即iinetpub \ wwwroot \ Todos）而不是在本地主机的根目录下查找资产文件？

我构建的dist文件和目录如下：

index.html
css / app.45a2082d.css
js / app.34c2e8cc.js

vue-router配置：

export default new Router({
    mode: "history",
    routes: [
        {
            path: "/",
            name: "home",
            component: Home
        },
        {
            path: "/about",
            name: "about",
            component: About
        }
    ]
});

我是否在IIS配置中缺少其他内容？为什么它可以在IIS Express下工作，而不能在系统的IIS下工作？问题在其他地方吗？

Answer 1

原来，我必须配置Vue来设置baseUrl并匹配应用程序的路径。在vue.config.js中：

module.exports = {
    baseUrl: '/todos'
};

在IIS下提供的Vue.js无法找到资产文件

1 个答案: