Question

我很想知道是否可以将整个Angular应用程序嵌套在一起。

想象一下，我将app1和app2作为两个独立的项目。我希望app2能够独立运作。我的意思是，我希望能够作为一个独立的应用程序提供和构建该项目。但是，我还希望能够将app1嵌套在app2的一个视图中。

目前存在的当前Angular架构是否完全可以实现。我知道Angular团队正在研究Angular Elements项目，我想知道这是否适合这类事情。

任何尝试过此事的人的任何想法都将受到赞赏。提前谢谢！

Answer 1

在这种情况下，最有可能让应用程序与shell保持一致，从中可以延迟加载两个子应用程序的模块。这将使您可以延迟加载兄弟应用程序的模块（和路由）。我在一个应用程序上工作，该应用程序有5个独立的“应用程序”，每个应用程序可以加载到我们的核心，然后当用户转到另一个应用程

Answer 2

对于您的情况，想法是app2将是app1中使用的库。

最简单的方法是使用nx扩展名。（https://nx.dev/angular）或创建一个角度库并将app2移至libray。

另一种方法是通过npm build进行自定义构建过程。您可以使用ng-packager为app1构建一个库。同时，您仍然可以使用ng serve或npm run在本地环境中测试app2。

https://medium.com/self-learning/ng-packagr-

安装ng-packagr

[Epoch: 1/10]  [Training Loss: 0.125]  [Test Loss: 0.045]  [Test Accuracy: 0.987]
[Epoch: 2/10]  [Training Loss: 0.043]  [Test Loss: 0.031]  [Test Accuracy: 0.991]
[Epoch: 3/10]  [Training Loss: 0.030]  [Test Loss: 0.030]  [Test Accuracy: 0.991]
[Epoch: 4/10]  [Training Loss: 0.024]  [Test Loss: 0.046]  [Test Accuracy: 0.990]
[Epoch: 5/10]  [Training Loss: 0.020]  [Test Loss: 0.032]  [Test Accuracy: 0.992]
[Epoch: 6/10]  [Training Loss: 0.017]  [Test Loss: 0.046]  [Test Accuracy: 0.991]
[Epoch: 7/10]  [Training Loss: 0.015]  [Test Loss: 0.034]  [Test Accuracy: 0.992]
[Epoch: 8/10]  [Training Loss: 0.011]  [Test Loss: 0.048]  [Test Accuracy: 0.992]
[Epoch: 9/10]  [Training Loss: 0.012]  [Test Loss: 0.037]  [Test Accuracy: 0.991]
[Epoch: 10/10]  [Training Loss: 0.013]  [Test Loss: 0.038]  [Test Accuracy: 0.992]

创建ng-package.json

npm install ng-packagr --save-dev

创建src / public_api.ts

{
  "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
  "lib": {
    "entryFile": "public_api.ts"
  }
}

运行ng-packagr以将应用程序构建为库

{
  "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
  "lib": {
    "entryFile": "./src/public_api.ts"
  },  
  "whitelistedNonPeerDependencies": ["."]
}

嵌套角度应用程序 - 可能吗？

2 个答案: