我可以跨应用重用组件吗?

Can I reuse components across apps?

我是 Angular2 的新手,我有兴趣了解是否有可能在另一个应用程序中重用一个应用程序中的整套表示组件?

例如,我有一个名为 MyApp 的 Angular 2 应用程序,其中我创建了一些常用组件,它们位于 app/components/common 文件夹中,每个都包含一个 TypeScript,Sass 和 HTML 文件。

我使用 Gulp 将 TypeScript 编译为 JS,并使用 Sass 将其编译为 CSS。

我现在宣布这些通用组件可以在我的其他 Angular 2 个应用程序中通用,因此我想在一个名为 MyOtherApp 的单独 Angular 2 应用程序中使用它们。

我希望能够从 MyApp 中提取所有常用组件,并能够在 MyOtherApp 中使用它们。

这可能吗?如果是这样,这种类型的组件公共共享的最佳方法是什么?

正如我所说,我将 Gulp 用于 building/running,并将 System.js 用于 Angular 应用程序的配置设置。

如果需要,我可以分享一些我尝试过的代码,但我不确定分享什么有帮助,所以请请求可能有用的代码,我会分享。

我认为最通用的方法是构建一个单独的库来发布 NgModule - 就像 Angular 本身、Angular Material 2 库和其他库一样。然而,它需要更多的努力来设置库的构建脚本并且使得调试更加困难。

另一种选择是为具有不同入口点文件的所有应用程序使用单个 TypeScript 项目,每个项目具有 Angular bootstrap 功能

我这样组织我的组件:

/routes
  /route1/
    route1component.ts
    /route1child1
    /route1child2
  /route2/
    route2component.ts
    /route2child1
    /route2child2

/apponents (project-level-reuse, must be used in at least 2 places with the app to be promoted to an apponent)
  /project-reusable-component

/components (cross-project-level-reuse, used across multiple projects)
  /cross-project-reusable-component

让我们假设使用 Git。现在在 "components" 中,我通常可以使用 Git 子模块在项目之间共享这些,这样可重用的 "components" 将存在于它们自己的 repo 中,并且可以作为子模块被拉入任何项目。