construire angulaire 4 projet pour la production

Question

Je travaille sur le projet angulaire 4. quand je lance "ng construire -prod -aot = false" pour construire des projets pour la production, j'ai message d'erreur que vous pouvez voir ci-dessous:

Heure: 44075ms gros morceau {0} polyfills.d8674538798840c67825.bundle.js (polyfills) 252 kB {5} [initial] [rendu] bloc {1} main.2d2d57386cb503360e3d.bundle.js (principal) 72 ko {4} [initial] [rendu] bloc {2} scripts.d0a13d2099c21c77943a.bundle. js (scripts) 410 ko {5} [initiale] [rendue] bloc {3} styles.aef7beffbbfb61f4f445.bundle.css (styles) 175 octets {5} [initiale] [rendue] bloc {4} vendor.e29287b60dbca26b1047. bundle.js (fournisseur) 3.43 Mo [initiale] [rendue] bloc {5} inline.6266454082b265a77bf0.bundle.js (inline) 0 octets [entrée] [r

ERREUR Erreur détectée lors de la résolution statique des valeurs de symbole. Les appels de fonction ne sont pas pris en charge. Envisagez de remplacer la fonction ou lambda par une référence à une fonction exportée (position 66:27 dans le fichier .ts d'origine), en résolvant le symbole AppModule dans C: /Ashirama_workspace/angularproject/src/app/app.module.ts "

voici mon app.modu.ts fichier:

import { NgModule } from '@angular/core'; 
    import { FormsModule,ReactiveFormsModule } from '@angular/forms'; 
    import {NgForm} from '@angular/forms'; 
    import { Http, HttpModule } from '@angular/http'; 
    import { HttpClientModule } from '@angular/common/http'; 
    import { BrowserModule } from '@angular/platform-browser'; 
    import { BrowserAnimationsModule } from '@angular/platform- 
    browser/animations'; 
    import { TranslateLoader, TranslateModule } from '@ngx-translate/core'; 
    import { TranslateHttpLoader } from '@ngx-translate/http-loader'; 
    import { AppRoutingModule } from './app-routing.module'; 
    import { AppComponent } from './app.component'; 
    import { AuthGuard } from './shared/'; 
    import {Guards}from './guards/guards'; 
    import {AuthenticationService} from 
    "./services/authentification.service"; 
    import {UserService} from "./services/user.service"; 
    import {HttpService} from "./services/http.service"; 
    import {LoginComponent} from './login/login.component'; 
    import { AuthHttp, AuthConfig, AUTH_PROVIDERS, provideAuth } from 
    'angular2-jwt'; 
    import {ToastModule} from 'ng2-toastr/ng2-toastr'; 
    import { ToastrModule } from 'ngx-toastr'; 
    import { AlertModule } from 'ngx-bootstrap/alert'; 
    import { Ng2BootstrapModule } from 'ngx-bootstrap/ng2-bootstrap'; 

    // AoT requires an exported function for factories 
    export function HttpLoaderFactory(http: Http) { 
    // for development 
    return new TranslateHttpLoader(http, '/assets/i18n/', '.json'); 
    } 
    @NgModule({ 
     declarations: [ 
     AppComponent 

    ], 
    imports: [ 
    BrowserModule, 
    BrowserAnimationsModule, 
    FormsModule, 
    ReactiveFormsModule, 
    HttpModule, 
    HttpClientModule, 
    AppRoutingModule, 
    ToastModule.forRoot(), 
    ToastrModule.forRoot(), 
    AlertModule.forRoot(), 
    Ng2BootstrapModule, 
    TranslateModule.forRoot({ 
     loader: { 
      provide: TranslateLoader, 
      useFactory: HttpLoaderFactory, 
      deps: [Http] 
      } 
     }) 
     ], 
    providers: [ 
    AuthGuard, 
    AuthenticationService, 
    UserService, 
    HttpService, 
    Guards, 
    AuthHttp, 
    provideAuth({ 
     headerName: 'Authorization', 
     headerPrefix: 'Bearer', 
     tokenName: 'id_token', 
     tokenGetter: (() => localStorage.getItem('id_token')), 
     globalHeaders: [{ 'Content-Type': 'application/json' }], 
     noJwtError: true 
    }) 


    ], 
    bootstrap: [AppComponent] 
     }) 
     export class AppModule { 
     } 

s'il vous plaît laissez-moi savoir ce que vous faites mal I'am merci

Answer 1

Vous devez convertir vos fonctions lambda () => something à une fonction d'exportation comme

export function doSomething() { 
    .... 
} 

Voir this Github post pour une description plus détaillée.

EDIT:

Dans votre cas, vous devez remplacer le provideAuth et AuthHttp avec la méthode de création:

export function getAuthHttp(http) { 
    return new AuthHttp(new AuthConfig({ 
    headerName: 'Authorization', 
    headerPrefix: 'Bearer', 
    tokenName: 'id_token', 
    tokenGetter: (() => localStorage.getItem('id_token')), 
    globalHeaders: [{ 'Content-Type': 'application/json' }], 
    noJwtError: true 
    }), http); 
} 

puis

providers: [ 
    { 
     provide: AuthHttp, 
     useFactory: getAuthHttp, 
     deps: [Http] 
    }, 

Answer 2

Il ressemble à secouer arbre ne se produit pas correctement résolu dans sa angulaire cli 1.4. .x mais si vous utilisez la version précédente de cli angulaire, vous pouvez ajouter des métadonnées de reflet et essayer de construire à nouveau

npm install -save reflect-metadata