Mufasa Mufasa - 2 months ago 62
TypeScript Question

Typescript warnings when using interface and OpaqueToken in Angular 2 app

I have been following the documentation here and use ng-cli.

I created the following configuration file (app-config.ts):

import { OpaqueToken } from '@angular/core';

export interface AppConfig {
supportTelephoneNumber: string;
}

export let APP_CONFIG_t = new OpaqueToken('app.config');

export const APP_CONFIG: AppConfig = {
supportTelephoneNumber: '1111 111 1111'
};


and in my app.module.ts file I have:

...
@NgModule({
declarations: [
UkCurrencyPipe,
AppComponent,
HomeComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
RouterModule.forRoot(ROUTES, { useHash: true }),
MaterialModule.forRoot()
],
providers: [
{ provide: APP_CONFIG_t, useValue: APP_CONFIG },
...


I use this configuration in my app.component.ts file like this:

import { Component, Inject } from '@angular/core';
import { APP_CONFIG_t, AppConfig } from './app-config';

@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.less']
})
export class AppComponent {
constructor(@Inject(APP_CONFIG_t) public config: AppConfig) {

callSupport(): void {
window.location.href = 'tel:+' + this.config.supportTelephoneNumber;
}
}


When I serve my app using ng serve everything seems to work fine but I do see these warnings in the console from where I run ng server:


WARNING in ./src/app/app.component.ts

40:166 export 'AppConfig' was not found in './app-config'

WARNING in ./src/app/app.component.ts

40:195 export 'AppConfig' was not found in './app-config'


Does anyone know what these warnings mean and whether or not I should worry about them?

My Versions


  • OS: Mac OS X El Capitan v10.11.6

  • ng-cli: v1.0.0-beta.16

  • angular: v2.0.1

  • typescript: v2.0.2


Answer

As per comment on issue https://github.com/angular/angular-cli/issues/2034

having the same issue. (Works fine despite warning) are you exporting more than one interface/class/const from the file? issue stopped for me after i exported each interface from its own dedicated file.

meaning if i had one file with multiple exports - i got warnings in build (export 'MyInterface1' was not found in '../file')

file.ts

export interface MyInterface1 {}
export interface MyInterface2 {}

after refactor - no warning

file1.ts

export interface MyInterface1 {}

file2.ts

export interface MyInterface2 {}