用于库的 Angular CLI 6.x 环境文件答案

【问题标题】：Angular CLI 6.x environment files for a library用于库的 Angular CLI 6.x 环境文件
【发布时间】：2018-11-23 05:39:15
【问题描述】：

我使用新的 CLI 6.x 创建了一个库。我还在其中创建了一个 Angular 服务，我想为我的开发和生产环境使用不同的 URL。所以我在我的库文件夹中创建了一个environment.ts 和一个environment.prod.ts 文件。

//dev
export const environment = {
  production: false,
  url: 'dev-url'
};

//prod
export const environment = {
  production: true,
  url: 'prod-url'
};

我还在angular.json 文件中添加了“fileReplacements”属性：

"configurations": {
  "production": {
    "fileReplacements": [{
      "replace": "projects/tk-shared/src/environments/environment.ts",
      "with": "projects/tk-shared/src/environments/environment.prod.ts"
    }],
    "project": "projects/tk-shared/ng-package.prod.json"
  }
}

使用ng build tk-shared 编译库可以工作并使用dev 设置，但是使用ng build --prod tk-shared 编译时出现以下错误：

Schema validation failed with the following errors: Data path "" should NOT have additional properties(fileReplacements).

我的提示是，原因是tk-shared 在angular.json 中有projectType: "library" 属性。
无论如何，是否可以在库中使用环境文件？

【问题讨论】：

这似乎是个坏主意。你的库不应该管理配置；消费应用程序应该通过库需要什么。从这个意义上说，一个库应该有点愚蠢，但足够聪明，可以知道什么时候没有提供它需要的配置。
@R.Richards 我喜欢你的想法。你能举个例子吗？
你可以找到一个例子来说明如何做到这一点here;这是给 Firebase 的。具体来说，看看他们如何实现/使用他们的initializeApp 函数。所有细节都在他们的代码中。玩得开心！
@R.Richards 感谢您的提示，我设法弄清楚了。这是一个优雅的解决方案！

标签： javascript angular typescript angular-cli

【解决方案1】：

谢谢，@R。理查兹为我指出了正确的解决方案！这两个来源帮助我弄清楚了如何正确地进行这种注入：LINK1 和 LINK2。

所以我做了什么...

创建了一个InjectionToken 并修改了我的TkSharedModule：

export const BASE_URL = new InjectionToken<string>('BASE_URL');
//...
export class TkSharedModule {
  static forRoot(host: string) {
    return {
      ngModule: TkSharedModule,
      providers: [{
        provide: BASE_URL,
        useValue: host
      }]
    }
  }
}

从我的AppModule 中的environment 文件中为该令牌提供了一个值：

import {environment} from '../environments/environment';
//...
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    TkSharedModule.forRoot(environment.url)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

最后在我的服务中注入了这个值：

//MyServiceService

import { BASE_URL } from '../tk-shared.module';

constructor(@Inject(BASE_URL) BASE_URL: string) {
  console.log('base url', BASE_URL);
}

【讨论】：

如果您想在库模块/项目的NgModule 装饰器中使用传递给forRoot 方法的内容，这种方法是否可行？
你的意思是environment.url的值吗？如果是这样，那么是的，因为在库的服务中，BASE_URL 将具有 environment.url 的值。
但是我说的是在NgModule装饰器中使用它，而不是库的内部服务。
@JakeSmith，有没有运气知道如何做到这一点？