Come abilitare la modalità di produzione?

Stavo leggendo domande correlate e ho trovato questo , ma la mia domanda è come posso passare dallo sviluppo alla modalità di produzione. Vi sono alcune differenze tra le modalità indicate qui .

Nella console posso vedere ....Call enableProdMode() to enable the production mode.Tuttavia, non sono sicuro dell'istanza di quale tipo dovrei chiamare quel metodo.

Qualcuno può rispondere a questa domanda?

Lo si abilita importando ed eseguendo la funzione (prima di chiamare bootstrap):

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

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

Ma questo errore indica che qualcosa non va nei tuoi attacchi, quindi non dovresti semplicemente scartarlo, ma cerca di capire perché sta accadendo.

Il modo migliore per abilitare la modalità di produzione per un'applicazione Angular 2 è usare angular-cli e costruire l'applicazione con ng build --prod. Ciò genererà l'applicazione con il profilo di produzione. L'uso di angular-cli ha il vantaggio di poter usare la modalità di sviluppo usando ng serveo ng builddurante lo sviluppo senza alterare il codice in ogni momento.

Questo ha funzionato per me, utilizzando l'ultima versione di Angular 2 (2.0.0-rc.1):

main.ts

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

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

Ecco il riferimento alle funzioni dai loro documenti: https://angular.io/api/core/enableProdMode

Quando ho costruito un nuovo progetto usando angular-cli. È stato incluso un file chiamato environment.ts. All'interno di questo file è presente una variabile come questa.

export const environment = {
  production: true
};

Quindi in main.ts hai questo.

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);

Potrei aggiungere questo a un progetto non angular-cli, suppongo, perché enableProdMode () viene importato da @ angular / core.

Vai a src/enviroments/enviroments.tse abilita la modalità di produzione

export const environment = {
  production: true
};

per Angular 2

Per abilitare la modalità di produzione in angolare 6.XX Basta andare al file di ambiente

Ti piace questo percorso

Il tuo percorso: project>\src\environments\environment.ts

Cambia production: falseda:

export const environment = {
  production: false
};

Per

export const environment = {
  production: true
};

La maggior parte delle volte la modalità prod non è necessaria durante il tempo di sviluppo. Quindi la nostra soluzione è di abilitarlo solo quando NON è localhost.

Nel browser in main.tscui definisci il tuo AppModule di root:

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

La isLocalpuò essere utilizzato anche per altri scopi, come enableTracingper la RouterModuleper meglio debug stack durante dev fase.

Quando viene utilizzato il comando ng build, sovrascrive il file environment.ts

Per impostazione predefinita, quando viene utilizzato il comando ng build, imposta l'ambiente dev

Per usare l'ambiente di produzione, usa il seguente comando ng build --env = prod

Ciò consentirà la modalità di produzione e aggiornerà automaticamente il file environment.ts

è possibile utilizzare in app.ts || file main.ts

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

Nel file environment.ts impostare la produzione su true

export const environment = {
  production: true
};

Per coloro che eseguono il percorso di aggiornamento senza passare a TypeScript utilizzare:

ng.core.enableProdMode()

Per me (in javascript) sembra che:

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

Non è necessario alcun ambiente.ts o tale file per essere fornito dal progetto seed. Basta avere un file configuration.ts e aggiungere tutte queste voci che richiedono una decisione di runtime (esempio: - registrazione della configurazione e degli URL). Ciò si adatta a qualsiasi struttura di progettazione e aiuta anche in futuro

configuration.ts

export class Configuration {

   isInProductionMode : bool = true;

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

// Ora usa nel tuo codice di avvio (main.ts o equivalente secondo il progetto del progetto seed

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

ng build --prod sostituisce environment.ts con environment.prod.ts

ng build --prod

Il mio progetto Angular 2 non ha il file "main.ts" menzionato altre risposte, ma ha un file " boot.ts ", che sembra avere più o meno la stessa cosa. (La differenza è probabilmente dovuta alle diverse versioni di Angular.)

Aggiungere queste due righe dopo l'ultima importdirettiva in "boot.ts" ha funzionato per me:

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