如何将模拟添加到本地构建？

Question

我正在使用 Angular 创建库项目来创建网络组件。所以我的项目在 /projects 文件夹中； /src 用于本地页面检查库。

我的模拟被添加到 /src 模块中 - 所以当加载库作为 Angular 模块时，它们可以工作。

但是如何将它们添加到 main.js 包中？就像，如果这是产品构建 - 不包括模拟；如果这个本地构建 - 包括模拟。

如何选择在构建时将哪些服务加载到模块？或者我如何为类似生产的包创建构建序列但使用模拟？

Answer 1

How to choose what service will be loaded to module at build time?

您可以有条件地导入模块（以及此模块中的服务），例如在 environment.production 标志上。

@NgModule({
    declarations: [AppComponent, ...],
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        HttpClientModule,
        ...,
        environment.production ? [] : MockModule   // THIS LINE IS IMPORTANT
    ],
    providers: [...],
    bootstrap: [AppComponent]
})
export class AppModule {}

在上面的示例中，您将 MockModule 导入应用程序仅用于生产构建，否则导入空数组。

Angular.json 文件有 fileReplacements 部分，您可以在其中为不同的构建配置（dev、prod 等）指定不同的文件。

如果您通过 ng cli 生成项目，

environment.ts 和 environment.prod.ts 应该开箱即用，但您也可以更新 fileReplacements 部分（您想要的使用您自己的配置构建配置，例如生产）并使用其他文件，如果您更适合的话。

// angular.json
"fileReplacements": [
    {
        "replace": "src/environments/environment.ts",
        "with": "src/environments/environment.prod.ts"
    }
],

如何将模拟添加到本地构建？

How to add mocks to local build?

angular