ASP.NET Core - 运行多个 Angular 2 应用程序

Question

我在尝试使用 ASP.NET Core 运行多个 Angular 2 应用程序时遇到了一些问题。我正在使用

具有预渲染功能的 JavaScriptServices

在 Visual Studio 2015 模板中。

我的解决方案的结构是here。

Core 包含带有服务器端路由的 ASP.NET 应用程序，每个 ClientApp 一旦绑定，就会被复制到 wwwroot 中.

这里的问题是 prerendering 功能，它上升了：

由于错误，预渲染失败：错误：区域已加载。

当我在第一次渲染 ClientApp1 后重新加载页面或尝试在 ClientApp1 和 ClientApp2 之间切换时，会发生这种情况。

有人可以帮我建议使用 boot-server 和 boot-client 样式运行多个 Angular2 应用程序的正确方法吗？

任何示例/建议将不胜感激。

该问题也在 github 中打开，地址为 github.com/aspnet/JavaScriptServices/issues/566

Answer 1

我使用的似乎可行的方法是在 webpack 配置中简单地定义多个入口点。

const clientBundleConfig = {
  entry: {
    'front': './client/front/main.ts',
    'admin': './client/admin/main.ts',
  },
  output: {
    path: './www/dist',
    filename: '[name].bundle.js'
  }
  ...
}

现在相关的 Angular 应用程序前端或管理员将从单个 HMR 进程更新。我无法让它使用相同的 dotnet 服务器进程与单独的 webpack 配置和 HMR 进程一起工作，我发现只有第一个应用程序会更新。

更新 由于遇到限制，我需要为应用程序执行单独的构建。我现在遵循 SteveSandersonMS 的建议，即为您链接到的 Github 问题中的每个应用程序调用 UseWebpackDevMiddleware，他的建议中唯一缺少的步骤是需要为每个应用程序指定一个唯一的端点：

app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions
{
    HotModuleReplacement = true,
    ConfigFile = "webpack.front.js",
    HotModuleReplacementEndpoint = "/__webpack_hmr_front"
});

app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions
{
    HotModuleReplacement = true,
    ConfigFile = "webpack.admin.js",
    HotModuleReplacementEndpoint = "/__webpack_hmr_admin"
});