c# - 部署 Angular 6 ASP.NET Core 应用程序

Question

我开发了一个 asp.net core 2.0 MVC 应用程序，并添加了一个 Angular 6 前端应用程序。它们都存在于相同的项目结构中。 asp.net 核心应用程序充当客户端 Angular 6 应用程序的 API。

我一直在并行开发它们并将以下代码段包含在 Startup.cs 文件中以允许在两个应用程序运行时进行开发:

ConfigureServices
      services.AddSpaStaticFiles(configuration => {
        configuration.RootPath = "ClientApp/dist";
      });

Configure
      app.UseSpa(spa => {
        spa.Options.SourcePath = "ClientApp";

        if (env.IsDevelopment()) {
          spa.UseAngularCliServer(npmScript: "start");
        }
      });

可以在 ClientApp 中找到 Angular 应用程序的项目结构。

我知道希望将此项目部署到 IIS。所以我要离开开发环境，所以我知道代码行:spa.UseAngularCliServer(npmScript: "start"); 不会运行。

当我通过 Visual Studio 发布项目并将其移动到 inetpub 文件夹时，就像我对其他应用程序所做的那样，它不提供我在 Angular 6 应用程序中开发的页面。尝试访问我在 Angular 6 应用程序的 RoutingModule 中定义的页面(例如/Home)时出现 500 内部服务器错误。

我假设这是因为我需要构建 Angular 应用程序(我可以通过 ng build --prod 完成)并将编译后的 JS 文件添加到 HTML 页面。但我不确定如何去做。如果有人有相关网页的任何链接，将不胜感激。或者，如果您能提供任何有用的见解。

更新#1:

在 Startup.cs 文件中，我使 app.UseDeveloperExceptionPage() 在生产模式下运行时可用。

我得到的不是 500 内部服务器错误页面，而是异常:SPA 默认页面中间件无法返回默认页面“/index.html”，因为未找到该页面，并且没有其他中间件处理该请求。

我还注意到 ClientApp/dist 文件夹在发布后不存在。我手动构建了 ClientApp 并将其添加到 inetpub 中的应用程序中。现在，我在控制台中收到错误:

runtime.a66f828dca56eeb90e02.js:1 Uncaught SyntaxError: Unexpected token <

polyfills.7a0e6866a34e280f48e7.js:1 Uncaught SyntaxError: Unexpected token <

Request:10 Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:8080/styles.169e0a841442606822c8.css".

scripts.ee7fed27c36eaa5fa8a9.js:1 Uncaught SyntaxError: Unexpected token <

main.befe6f4d3c1275f2e1b3.js:1 Uncaught SyntaxError: Unexpected token <

Answer 1

您需要将此代码用于 ASP.NET Core 2.0，而不是您正在使用的代码。我的应用程序是使用这种方法发布的。

        app.UseMvc(routes =>
        {
 //Remove this if you don't need it
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");

            routes.MapSpaFallbackRoute(
                name: "spa-fallback",
              defaults: new { controller = "Home", action = "SPAIndex" }); // For SPA 
        });

您需要在 HomeController 中有一个返回 View 的操作。查看代码是

<app asp-prerender-module="ClientApp/dist/main-server">Loading...</app>