2017-05-11 1 views
0

Regie von der Antwort auf my question about Server-side rendering, ich bin auf der Umsetzung von AOT Compilation in meiner Angular2 App.Angular2 AOT Compilation mit statischen externen js-Datei

Ein bisschen Hintergrund zu dem Problem, das ich habe: Wir haben einen Build in Visual Studio Online laufen, die Webpack usw. läuft und eine funktionierende Webapp versendet. Wir haben dann eine Freigabe in VSO zu verschiedenen Umgebungen, die einige Werte (Umgebung, Basis-URLs, wichtige Schlüssel) in eine env-config.js Datei legt. Diese env-config.js Datei ist nicht gebündelt und verpackt in der App, aber wir greifen auf sie als globale js-Variable innerhalb unseres Angular-Codes zu.

env-config.js

var envConfig = { 
    'environment': 'local', 
    'baseApiUrl': 'localhost:5555', 
} 

Innerhalb app-config.ts wir envConfig aus dem Fenster Objekt zuzugreifen, speichern diese als eine Konstante, und exportieren Sie die Konstante AppConfig, die wir in app.module registrieren dann ein OpaqueToken mit .

app-config.ts

export function getEnvConfig(): IAppEnvConfig { 
    if (window == null) { 
     return { 
      'environment': '', 
      'baseApiUrl': '' 
     }; 
    } 
    else { 
     return (window as any).envConfig; 
    } 
} 

export const _envConfig: IAppEnvConfig = getEnvConfig(); 

export const AppConfig: IAppConfig = { 
    applicationName: 'Web Application', 
    environment: _envConfig.environment, 
    baseApiUrl: _envConfig.baseApiUrl, 
    otherSetting: 'someValue' 
} 

Das funktioniert läuft wirklich gut im Browser mit dem JIT-Compiler. Ich folge einer Kombination von this und this und anderen Tutorials, um die AOT-Kompilierung zu ermöglichen.

ngc Laufen gibt mir die folgende Fehlermeldung:

"node_modules/.bin/ngc" -p app/tsconfig-aot.json Error encountered 
resolving symbol values statically. Calling function 'getEnvConfig', 
function calls are not supported. Consider replacing the function or lambda 
with a reference to an exported function, resolving symbol AppConfig 

ich den Scheck für window == null in getEnvConfig() hinzugefügt, weil ich glaube nicht, window bei Nicht-Browser-Sammlung zur Verfügung stehen wird. Wenn getEnvConfig() irgendetwas anderes als ein leeres IAppEnvConfig Objekt zurückgibt, bekomme ich den ngc Fehler.

Ich habe eine Menge Googeln gemacht, aber habe nichts bestimmtes zu meinem Problem gefunden, außer allgemeine Antworten, die auf die Verwendung einer Factory-Funktion verweisen, um eine neue Instanz einer Klasse zu erstellen, was ich hier versucht habe.

Tut mir leid, wenn das nicht viel Sinn ergibt - bitte zögern Sie nicht, sich zu erkundigen/sagen Sie mir, dass ich etwas unglaublich dummes mache.

Vielen Dank im Voraus, Alex

Antwort

0

Ich bin mir nicht sicher, ob diese Lösung Sie passen, aber ich es irgendeine Art und Weise veröffentlichen. Ich hatte das gleiche Problem und das Problem war ziemlich einfach zu lösen. Stellen Sie einfach Ihre Funktionen in eine Klasse. Etwas wie dieses:

export class AppConfig { 
    _envConfig = AppConfig.getEnvConfig(); 
    AppConfig = { 
    applicationName: 'Web Application', 
    environment: this._envConfig.environment, 
    baseApiUrl: this._envConfig.baseApiUrl, 
    otherSetting: 'someValue' 
    }; 

    static getEnvConfig() { 
    if (window == null) { 
     return { 
     'environment': '', 
     'baseApiUrl': '' 
     }; 
    } else { 
     return (window as any).envConfig; 
    } 
    } 

    private constructor(){} 
} 
+0

Danke! Wie würden Sie dies in Ihrer app.module.ts registrieren, damit Sie es mit der DI verwenden können? Benutzt du immer noch das OpaqueToken oder spritzt einfach wie ein Service? – Alex

+0

Nun, das ist nur eine normale Klasse, also glaube ich nicht, dass du DI brauchst. Ich habe noch nie mit OpaqueToken gearbeitet, aber ich habe gelesen, dass es durch InjectionToken ersetzt wurde. Nichtsdestotrotz scheint mir das alles zu übertrieben zu sein, denn das CLI hat dafür eine eingebaute Option: https://github.com/angular/angular-cli/wiki/stories-application-environments –

+0

Wie hat das geklappt? ? –

Verwandte Themen