I am using angular-cli to create an Angular 4 app.
I want to make use of the toastr, so I install the toastr plugin using npm and configure it as shown in the code below.
When running the app, everything works fine. But when I run 'ng build prod', I get the exception below.
How can I resolve this issue? Any idea please?
Thanks
ERROR in Error encountered resolving symbol values statically. Reference to a local (non-exported) symbol 'toastr'. Consider exporting the symbol (position 35:13 in the original .t s file), resolving symbol AppModule in D:/Projects/afundamentals/src/app/app.module.ts
- Create a new typescript file 'toastr.service.ts' as follows:
import { OpaqueToken } from '@angular/core';
export let TOASTR_TOKEN = new OpaqueToken('toastr'); // TOASTR_TOKEN is an object
export interface Toastr {
success (msg: string, title?: string): void;
info (msg: string, title?: string): void;
warning (msg: string, title?: string): void;
error (msg: string, title?: string): void;
} - Then, in the 'app.module.ts' I add the following:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { TOASTR_TOKEN, JQUERY_TOKEN, Toastr } from './common/index';
// declaring the global object toastr and optionally assigning a type of Toastr
declare let toastr : Toastr;
@NgModule({
declarations: [
AppComponent,
...
],
imports: [
BrowserModule,
...
],
providers: [
...
{ provide: TOASTR_TOKEN, useValue: toastr },
...
],
bootstrap: [AppComponent]
})
export class AppModule { }