¿Cómo habilitar el modo de producción?

Estaba leyendo preguntas relacionadas y encontré esta , pero mi pregunta es cómo puedo cambiar del modo de desarrollo al modo de producción. Hay algunas diferencias entre los modos que se señalan aquí .

En la consola puedo ver ....Call enableProdMode() to enable the production mode.Sin embargo, no estoy seguro de qué tipo de llamada debo usar para ese método.

¿Alguien puede responder esta pregunta?

Lo habilita importando y ejecutando la función (antes de llamar a bootstrap):

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

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

Pero este error es un indicador de que algo está mal con sus enlaces, por lo que no debe simplemente descartarlo, sino tratar de descubrir por qué está sucediendo.

La mejor manera de habilitar el modo de producción para una aplicación Angular 2 es usar angular-cli y construir la aplicación con ng build --prod. Esto construirá la aplicación con perfil de producción. Usar angular-cli tiene la ventaja de poder usar el modo de desarrollo usando ng serveo ng buildmientras se desarrolla sin alterar el código todo el tiempo.

Esto funcionó para mí, utilizando la última versión de Angular 2 (2.0.0-rc.1):

main.ts

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

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

Aquí está la referencia de función de sus documentos: https://angular.io/api/core/enableProdMode

Cuando construí un nuevo proyecto usando angular-cli. Se incluyó un archivo llamado environment.ts. Dentro de este archivo hay una variable como esta.

export const environment = {
  production: true
};

Luego en main.ts tienes esto.

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

Podría suponer esto a un proyecto no angular-cli, supongo, porque enableProdMode () se está importando desde @ angular / core.

Ve src/enviroments/enviroments.tsy habilita el modo de producción

export const environment = {
  production: true
};

para Angular 2

Para habilitar el modo de producción en angular 6.XX Simplemente vaya al archivo de entorno

Como este camino

Tu camino: project>\src\environments\environment.ts

Cambiar production: falsede:

export const environment = {
  production: false
};

A

export const environment = {
  production: true
};

La mayoría de las veces el modo de producción no es necesario durante el tiempo de desarrollo. Entonces, nuestra solución es habilitarlo solo cuando NO sea localhost.

En los navegadores main.tsdonde define su AppModule raíz:

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

El isLocaltambién se puede utilizar para otros fines como enableTracingpara el RouterModulemejor seguimiento de la pila durante la depuración dev fase.

Cuando se usa el comando ng build, sobrescribe el archivo environment.ts

Por defecto, cuando se usa el comando ng build, establece el entorno de desarrollo

Para usar el entorno de producción, use el siguiente comando ng build --env = prod

Esto habilitará el modo de producción y actualizará automáticamente el archivo environment.ts

puedes usar en tu app.ts || archivo main.ts

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

En el entorno.ts el archivo establece la producción en verdadero

export const environment = {
  production: true
};

Para aquellos que realizan la ruta de actualización sin cambiar también a TypeScript, use:

ng.core.enableProdMode()

Para mí (en javascript) esto se ve así:

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

No necesita ningún entorno.ts o tal archivo para ser proporcionado por su proyecto semilla. Solo tenga un archivo configuration.ts y agregue todas las entradas que requieran una decisión de tiempo de ejecución (ejemplo: configuración de registro y URL). Esto encajará en cualquier estructura de diseño y también ayudará en el futuro

configuration.ts

export class Configuration {

   isInProductionMode : bool = true;

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

// Ahora úsalo en tu código de inicio (main.ts o equivalente según el diseño del proyecto semilla

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

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

ng build --prod

Mi proyecto Angular 2 no tiene el archivo "main.ts" mencionado en otras respuestas, pero sí tiene un archivo " boot.ts ", que parece ser casi lo mismo. (La diferencia probablemente se deba a las diferentes versiones de Angular).

Agregar estas dos líneas después de la última importdirectiva en "boot.ts" funcionó para mí:

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