Question

如何在项目之间共享代码？

我有两个使用以下应用创建的应用

ng generate application app1

ng generate application app2

我希望projects/app1/src/app.module.ts从projects/app2/src/shared/common.module.ts导入模块

在没有创建名为common或诸如此类的第三个项目的情况下，最佳实践是什么？创建一个项目/普通项目，或者仅创建一个名为common的文件夹，然后在此处放置TypeScript文件并导入它们。

Answer 1

使用图书馆项目！

ng generate library common

这会自动将路径别名添加到主tsconfig.json

  "common": [
    "dist/prod/common"
  ],
  "common/*": [
    "dist/prod/common/*"
  ]

这将允许您引用在common库项目中定义的模块以及导出的组件，服务和管道。

例如，在您的app.module.ts中的任何一个中：

import { SharedModule } from 'common';

@NgModule({
  imports: [
    SharedModule,
    ...
  ],
  declarations: [...],
  exports: [...]
  bootstrap: [AppComponent]
})
export class AppModule { }

在消费类应用程序ng serve（例如，用于开发）期间支持热重载的另一种方法是从项目级别的通用public_api导入，如下所示：

import { SharedModule } from 'projects/common/src/public_api';

@NgModule({
  imports: [
    SharedModule,
    ...
  ],
  ...
})
export class AppModule { }

尝试一下，我已经大量使用它了，而且效果惊人！我强烈建议您阅读此文档：

https://github.com/angular/angular-cli/wiki/stories-create-library

Answer 2

如果大多数Apps共享通用代码，我将建议使用动态路由和延迟加载模块的另一种方法。在同一代码库中，您可以将所有特定于应用程序的代码添加到新模块中。然后，在环境文件中添加一个附加标志，并创建一个新的环境文件，以便可以通过实习配置--c将应用程序构建到不同的捆绑软件中。有关更多详细信息，请查看此article

angular 6-在项目之间共享通用代码的最佳实践

2 个答案: