So aktivieren Sie den Produktionsmodus in Angular 2

Dies funktionierte für mich mit der neuesten Version von Angular 2 (2.0.0-rc.1):

main.ts

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

enableProdMode();
bootstrap(....);

Hier ist die Funktionsreferenz aus ihren Dokumenten: https://angular.io/api/core/enableProdMode

Um den Produktionsmodus für eine Angular 2-Anwendung zu aktivieren, verwenden Sie angle-cli und erstellen die Anwendung mit ng build --prod. Dadurch wird die Anwendung mit dem Produktionsprofil erstellt. Die Verwendung von angle-cli hat den Vorteil, dass der Entwicklungsmodus während der Entwicklung mit ng serve oder ng build verwendet werden kann, ohne den Code ständig zu ändern. 

Wenn ich ein neues Projekt mit angle-cli erstellt habe. Es wurde eine Datei mit dem Namen environment.ts aufgenommen. In dieser Datei befindet sich eine Variable wie diese.

export const environment = {
  production: true
};

Dann in main.ts hast du das.

import './polyfills.ts';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { environment } from './environments/environment';
import { AppModule } from './app/';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

Sie könnten dies einem nicht-angle-cli-Projekt hinzufügen, würde ich davon ausgehen, dass enableProdMode () aus @ angle/core importiert wird.

Gehen Sie zu src/enviroments/enviroments.ts und aktivieren Sie den Produktionsmodus

export const environment = {
  production: true
};

für Angular 2

Um den Produktionsmodus in Winkel 6.X.X zu aktivieren, gehen Sie zur Umgebungsdatei

Wie dieser Weg

Ihr Pfad: project>\src\environments\environment.ts

production: false ändern von: 

export const environment = {
  production: false
};

Zu 

export const environment = {
  production: true
};

Die meiste Zeit wird der Prod-Modus während der Entwicklungszeit nicht benötigt. Unsere Problemumgehung besteht also darin, es nur zu aktivieren, wenn es NICHT localhost ist. 

In main.ts Ihres Browsers definieren Sie Ihr Root-AppModule: 

const isLocal: boolean = /localhost/.test(document.location.Host);
!isLocal && enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule);

Die Variable isLocal kann auch für andere Zwecke verwendet werden, z. B. enableTracing für die Variable RouterModule, um die Stapelverfolgung des Debuggings während der Entwicklungsphase zu verbessern.

Wenn der Befehl ng build verwendet wird, wird die Datei environment.ts überschrieben

Wenn der Befehl ng build verwendet wird, wird standardmäßig die dev-Umgebung festgelegt

Verwenden Sie den folgenden Befehl, um die Produktionsumgebung zu verwenden: build --env = prod

Dies aktiviert den Produktionsmodus und aktualisiert automatisch die Datei environment.ts

Für diejenigen, die den Aktualisierungspfad ausführen, ohne ebenfalls zu TypeScript zu wechseln, verwenden Sie Folgendes:

ng.core.enableProdMode()

Für mich (in Javascript) sieht das so aus:

var upgradeAdapter = new ng.upgrade.UpgradeAdapter();
ng.core.enableProdMode()
upgradeAdapter.bootstrap(document.body, ['fooApp']);

Sie benötigen keine environment.ts oder eine solche Datei, die von Ihrem Seed-Projekt bereitgestellt wird. Nehmen Sie einfach eine configuration.ts auf und fügen Sie alle Einträge hinzu, für die eine Laufzeitentscheidung erforderlich ist (Beispiel: - Protokollierung von Konfiguration und URLs). Dies passt in jede Designstruktur und hilft auch in Zukunft

configuration.ts

export class Configuration {

   isInProductionMode : bool = true;

   // other configuration
   serviceUrl : string = "http://myserver/myservice.svc";
   logFileName : string = "...";
}

// Jetzt in Ihrem Startcode verwenden (main.ts oder gleichwertig gemäß dem Seed-Projektdesign)

import { Configuration } from './configuration';
import { enableProdMode } from '@angular/core';
....
if (Configuration.isInProductionMode)
    enableProdMode();

sie können in Ihrem app.ts || verwenden main.ts-Datei

import {enableProdMode} from '@angular/core';
enableProdMode();
bootstrap(....);

ng build --prod ersetzt environment.ts durch environment.prod.ts ng build --prod

Mein Angular 2-Projekt hat nicht die "main.ts" -Datei, die andere Antworten enthält, aber es hat eine " boot.ts " -Datei, die scheinbar dasselbe ist. (Der Unterschied ist wahrscheinlich auf verschiedene Versionen von Angular zurückzuführen.)

Das Hinzufügen dieser beiden Zeilen nach der letzten import-Direktive in "boot.ts" funktionierte für mich:

import { enableProdMode } from "@angular/core";
enableProdMode();

In der Datei environment.ts wird die Produktion auf true gesetzt

export const environment = {
  production: true
};

Angular-Apps werden standardmäßig im Entwicklungsmodus ausgeführt. Dies wird in der folgenden Meldung auf der Browserkonsole angezeigt:
Angular is running in the development mode. Call enableProdMode() to enable the production mode.

Durch das Umschalten in den Produktionsmodus kann die Ausführung beschleunigt werden, indem entwicklungsspezifische Überprüfungen wie die Erkennung von Doppeländerungen deaktiviert werden.

Das Erstellen für die Produktion (oder das Anhängen des Flags --environment = prod) aktiviert den Produktionsmodus. Sehen Sie sich die CLI-generierten main.ts an, um zu sehen, wie dies funktioniert.