单个 webpack 配置中的多个角度应用程序答案

【问题标题】：multiple angular application in single webpack config单个 webpack 配置中的多个角度应用程序
【发布时间】：2019-05-30 02:40:03
【问题描述】：

我有一个项目，上面有许多独立的角度应用程序。典型的用户案例可以是：

admin.ts
front.ts
dashboard.ts

每个都是 Angular 应用程序。为了解决这个问题，我实际上只有一个 webpack.config.js，我在那里做所有的包装工作。

当我想添加 AoT 编译时，问题就来了。为此，我使用@ngtools/webpack，不幸的是，我们必须在我们的 webpack 配置中硬编码入口点路径，如下所示：

  plugins: [
    new AngularCompilerPlugin({
      tsConfigPath: 'path/to/tsconfig.json',
      entryModule: 'path/to/app.module#AppModule',
      sourceMap: true
    })
  ]

当您在 angular-cli 问题跟踪器上can see here 时，他们没有任何计划处理多个条目模块。

你有什么神奇的技巧来解决这个限制并且仍然保持单一的编译过程吗？

proof of concept is available on my github

【问题讨论】：

亲爱的@yanis-git，你找到魔术了吗？
如果您查看我的存储库，我已经找到了一种玩 @Diego 的方法，您将拥有可运行的 PoC，其中我基于参数引导不同的 webpack 配置。如果你愿意，我可以逐步改进我的自述文件。
不需要。我明白了，很清楚。谢谢！

标签： angular webpack angular2-aot aot

【解决方案1】：

我建议查看@angular-builders/custom-webpack

它扩展了@angular-devkit/build-angular，但允许你修改 webpack 配置。允许您添加其他入口点等。它有关于如何设置它的相当好的文档。

【讨论】：

感谢@Josh 的回答。我已经尝试过这种方法，但是当我尝试获得 AOT 支持时遇到了设计问题。正如你在我的帖子中看到的，Angular 需要提供 entryModule 的 AngularCompilerPlugin 对象。插件 webpack 部分为所有 webpack 入口点共享。