是否可以不使用npm导入Angular库？

Question

我收到管理部门的要求，我们有一个Angular应用程序，我们正在尝试在一个单独的项目中构建一个新应用程序，但我们希望将其集成到主应用程序中。 目标是要有一个独立的新应用程序，可以与主应用程序独立开发和部署。

我考虑过创建库项目的选项，以便我们可以导入到主应用程序中，并且如果要使用npm软件包分发应用程序库也可以使用，但是这不允许我们独立部署新应用程序而不必部署主应用程序。

有没有办法以我可以执行的任何方式将单独的应用程序（角度）导入到主应用程序（角度）中。

我试图将库的dist文件夹部署到Github，并将其导入angular-cli.json中的脚本中，但是没有用。

任何帮助将不胜感激。

Answer 1

有两种选择，但是没有“完美”的选择，因为您必须确切地确定要使用的路线等，看看是否可行。 例如，如果您想要SPA，则两个应用程序都将尝试处理“ /”。

我将以一个示例为例，尽管您在文档中有一个主应用程序，例如Tour of Heroes应用程序，但是您想添加一个Wiki应用程序。 根据您的规范，我假设您希望wiki应用程序在主应用程序中运行时位于/wiki下，并且位于/自身下。 例如，当Wiki独立运行时，主应用程序中的主应用程序/wiki/pages/tutorial将与/pages/tutorial相同。

选项1：将应用程序完全分开，在主应用程序中使用编译的Wiki

我认为这就是您想要做的。 这些应用程序将不会共享任何服务或组件，并且会分别进行编译。 我能想到的唯一方法是将它们编译成单独的应用程序，并将其中一个托管在另一个应用程序的子文件夹中。 您的服务器无法重写所有网址，但是取决于您应该能够将/wiki路由到第二个应用程序的类型。 您将必须在SPA中捕获指向“ / wiki”的所有链接，并强制重新加载整个页面，以便浏览器选择Wiki的index.html。 基本href也可能有一些问题需要克服，但应该可以解决。

选项2：在一个仓库中分离应用

此页面对此进行了很好的概述。 Angular的最后几个版本使您可以在同一文件夹中创建单独的模块和应用程序。 无耻地复制：

App1模块

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
@NgModule({})

App1SharedModule

export class App1SharedModule{
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: AppModule,
      providers: []
    }
  }
}

组合应用

imports: [
  BrowserModule,
  AppRoutingModule,
  App1SharedModule.forRoot(),
  App2SharedModule.forRoot()
],

每个人都可以单独运行，但也可以一起运行。 不过，您的路由可能会受阻，因此您必须为两个应用程序创建一个子路由，这些应用程序可以单独运行，也可以与相同的URL一起运行。 即，即使单独运行，第一个应用程序中的所有内容都将位于app1/下。

选项3：图书馆

您可以使用Wiki服务和组件创建一个库 。 然后，您可以将npm将其安装到您的主应用程序和骨架应用程序中，以使Wiki自行运行。 你可以暴露Routes对象，并使用forChild在主应用程序，并forRoot在您的wiki应用程序。

Answer 2

如果其他人不知道如何执行此操作，在这种情况下，我可以使用Github Tag解决此问题。

我跑了： npm install github:org/lib