【问题标题】:Angular 6 - Create single page with multiple applications insideAngular 6 - 创建包含多个应用程序的单个页面
【发布时间】:2018-12-22 04:47:48
【问题描述】:

我需要在 Angular 6 中构建多个应用程序。每个应用程序都有自己的组件、服务等。

但我还需要所有应用程序共享服务、组件、指令等。

接下来我需要创建一个根应用程序,其中将包含之前创建的应用程序。此根应用程序应该能够在选项卡中并排显示应用程序。

完成这样的应用程序的最佳方法是什么?如何构建架构以及使用哪些技术/框架?

谢谢。

【问题讨论】:

    标签: angular shell typescript architecture angular6


    【解决方案1】:

    从 Angular 6 开始,他们在 Angular 配置文件中引入了项目的概念。根据您的需要,项目可以是应用程序或库。

    要开始使用此功能,您需要先创建 Angular 6 默认应用程序(参考 https://github.com/angular/angular-cli/blob/master/docs/documentation/new.md)。

    ng new <app-name>
    

    一旦您拥有默认应用程序,您就可以像使用 ng generate application 命令一样向其中添加其他应用程序项目(参考:https://github.com/angular/angular-cli/wiki/generate-application

    ng generate application <application-name>
    

    要向其中添加库,您需要使用 ng generate library 命令(参考:https://github.com/angular/angular-cli/wiki/generate-library

    ng generate library <library-name>
    

    要在 Angular 6 配置文件中提供特定应用程序,您可以使用 ng serve 命令并指定要提供服务的应用程序。例如,要为应用程序名称 MyCoolNewSite 提供服务,您将执行:

    ng serve --project <application-name>
    

    我正在使用这种方法构建一个新的 UI 应用程序。到目前为止,它似乎确实可以满足我的需求,但我仍处于项目初期。

    如果这有帮助,请告诉我。

    【讨论】:

      【解决方案2】:

      一个 Angular 项目是创建一个应用程序,只有一个。如果您想共享内容并将应用程序拆分为您需要的模块,然后创建具有所需架构的模块。

      在管道末端有多个 Angular 应用程序,您将需要编译所有这些应用程序以用于生产,而不仅仅是一个

      推荐使用Modules和Lazy loading Modules

      【讨论】:

      • 感谢您的回答。当你想编译一个用于生产的模块时怎么办?可能会发生客户端 X 进入根应用程序并看到模块 A 的版本 1,客户端 Y 进入应用程序并看到模块 A 的版本 1.1 的情况。有几个开发团队,每个团队将创建自己的模块,然后嵌入到根应用程序。将来,我不想编译整个应用程序以用于生产,只是按模块
      猜你喜欢
      • 2020-02-17
      • 2012-09-06
      • 1970-01-01
      • 2018-12-09
      • 2017-03-03
      • 1970-01-01
      • 1970-01-01
      • 2020-08-23
      • 1970-01-01
      相关资源
      最近更新 更多