web-dev-qa-db-fra.com

Comment activer le mode de production dans Angular 2

Je suis nouveau sur Angular2, je lisais des questions résolues et j'ai trouvé ceci

Erreur de liaison à la méthode Angular2: "la valeur a été modifiée après vérification"

ce qui est très intéressant, mais ma question est de savoir comment puis-je passer du développement à la production, c’est qu’il ya des différences après avoir lu cette question

Quelle est la différence entre la production et le mode de développement dans Angular2?

J'ai cherché mais rien trouvé pour indiquer que le mode, et où vous devez indiquer le mode (développement) ou le mode (production).

je peux voir dans la console ....Call enableProdMode() to enable the production mode. mais où dans System.config({ ou dans les classes de composants.

Une importation spécifique est-elle nécessaire?

angular
150
Angel Angel

Vous l'activez en important et en exécutant la fonction (avant d'appeler bootstrap):

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

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

Mais cette erreur indique que quelque chose ne va pas dans vos liaisons, vous ne devez donc pas simplement la rejeter, mais essayez de comprendre pourquoi cela se produit.

182
Sasxa

Cela a fonctionné pour moi, en utilisant la dernière version de Angular 2 (2.0.0-rc.1):

main.ts

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

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

Voici la référence de fonction de leur documentation: https://angular.io/api/core/enableProdMode

54
adampasz

Le meilleur moyen d'activer le mode de production pour une application Angular 2 consiste à utiliser angular-cli et à créer l'application avec ng build --prod. Cela construira l'application avec le profil de production. L'utilisation de angular-cli présente l'avantage de pouvoir utiliser le mode développement en utilisant ng serve ou ng build tout en développant sans modifier le code à tout moment. 

50
Matthias B

Quand j'ai construit un nouveau projet en utilisant angular-cli. Un fichier appelé environment.ts a été inclus. Dans ce fichier se trouve une variable comme celle-ci.

export const environment = {
  production: true
};

Dans Main.ts, vous avez ceci. 

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

Vous pourriez l'ajouter à un projet non angular-cli, je suppose, car enableProdMode () est importé de @ angular/core.

38
howserss

Aller à src/enviroments/enviroments.ts et activer le mode de production

export const environment = {
  production: true
};

pour Angular 2

10
Alexander Schmidt

Pour activer le mode de production en mode angulaire 6.X.X , Il suffit d'aller au fichier d'environnement

Comme ce chemin

Votre chemin: project>\src\environments\environment.ts

Changer production: false de: 

export const environment = {
  production: false
};

À 

export const environment = {
  production: true
};

 enter image description here

6
Osama khodrog

La plupart du temps, le mode prod n'est pas nécessaire pendant le développement. Notre solution de contournement consiste donc à l'activer uniquement lorsqu'il s'agit deNOTlocalhost. 

Dans le main.ts de votre navigateur où vous définissez votre AppModule racine: 

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

La isLocal peut également être utilisée à d'autres fins, comme enableTracing pour la RouterModule, afin de mieux tracer la trace de la pile pendant la phase de développement.

5
Leon li

Lorsque la commande ng build est utilisée, elle remplace le fichier environment.ts.

Par défaut, lorsque la commande ng build est utilisée, elle définit l'environnement dev.

Pour utiliser l’environnement de production, utilisez la commande suivanteng build --env = prod

Cela activera le mode de production et mettra automatiquement à jour le fichier environment.ts.

4
Waqas Saleem

Pour ceux qui effectuent le chemin de mise à niveau sans basculer également vers TypeScript, utilisez:

ng.core.enableProdMode()

Pour moi (en javascript) cela ressemble à:

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

Vous n'avez besoin d'aucun fichier environment.ts ou de ce type à fournir par votre projet pilote. Ayez juste un fichier configuration.ts et ajoutez toutes les entrées de ce type qui nécessitent une décision d’exécution (exemple: - configuration de la journalisation et URL). Cela ira dans n'importe quelle structure de conception et aidera également à l'avenir

configuration.ts 

export class Configuration {

   isInProductionMode : bool = true;

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

// Maintenant, utilisez dans votre code de démarrage (main.ts ou équivalent selon la conception du projet de départ)

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

vous pouvez utiliser dans vos applications || fichier main.ts

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

ng build --prod remplace environment.ts par environment.prod.ts ng build --prod

1
Mahmoudi MohamedAmine

Mon projet Angular 2 ne contient pas le fichier "main.ts" mais mentionne le fichier " boot.ts ", qui semble correspondre à la même chose. (La différence est probablement due à différentes versions de Angular.)

Ajouter ces deux lignes après la dernière directive import dans "boot.ts" a fonctionné pour moi:

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

Dans le fichier environment.ts, la production est vraie

export const environment = {
  production: true
};
0
Vinodh Ram