プロダクションモードを有効にする方法は？

私は関連する質問を読んでいて、これを見つけましたが、私の質問は、開発モードからプロダクションモードに切り替える方法です。ここで指摘されているモードにはいくつかの違いがあります。

コンソールで....Call enableProdMode() to enable the production mode.確認できますが、そのメソッドを呼び出す必要がある型のインスタンスがわかりません。

誰かがこの質問に答えられますか？

これを有効にするには、（ブートストラップを呼び出す前に）関数をインポートして実行します。

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

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

ただし、このエラーはバインディングに問題があることを示しているため、単に無視するのではなく、なぜそれが起こっているのかを理解してください。

Angular 2アプリケーションのプロダクションモードを有効にする最良の方法は、angular-cliを使用してでアプリケーションをビルドすることですng build --prod。これにより、本番プロファイルでアプリケーションが構築されます。angular-cliを使用すると、コードを常に変更せずに、開発モードを使用して、ng serveまたは開発中に開発モードを使用できるという利点がありますng build。

これは、Angular 2の最新リリース（2.0.0-rc.1）を使用して動作しました。

main.ts

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

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

ここにそれらのドキュメントからの関数リファレンスがあります：https : //angular.io/api/core/enableProdMode

angular-cliを使用して新しいプロジェクトをビルドしたとき。environment.tsというファイルが含まれていました。このファイル内には、そのような変数があります。

export const environment = {
  production: true
};

次にmain.tsにこれがあります。

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

enableProdMode（）が@ angular / coreからインポートされているため、これを非Angular-cliプロジェクトに追加できます。

src/enviroments/enviroments.tsプロダクションモードに移動して有効にする

export const environment = {
  production: true
};

Angular 2用

Angular 6.XXでプロダクションモードを有効にするには、環境ファイルに移動します。

この道のように

あなたの道： project>\src\environments\environment.ts

production: falseからの変更：

export const environment = {
  production: false
};

に

export const environment = {
  production: true
};

ほとんどの場合、prodモードは開発時には必要ありません。したがって、私たちの回避策は、それがlocalhost ではない場合のみ有効にすることです。

お使いのブラウザの中にmain.ts、あなたのルートAppModuleを定義します。

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

isLocalまた、のような他の目的に使用することができるenableTracingためRouterModule、より良いのdevのフェーズ中にスタックトレースをデバッグするため。

ng buildコマンドを使用すると、environment.tsファイルが上書きされます

デフォルトでは、ng buildコマンドを使用すると、開発環境が設定されます

本番環境を使用するには、次のコマンドを使用しますng build --env = prod

これにより、本番モードが有効になり、environment.tsファイルが自動的に更新されます

app.tsで使用できます|| main.tsファイル

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

TypeScriptに切り替えずにアップグレードパスを実行する場合：

ng.core.enableProdMode()

私（JavaScript）では、次のようになります。

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

シードプロジェクトによって提供される環境ファイルやそのようなファイルは必要ありません。configuration.tsを用意し、実行時の決定を必要とするそのようなエントリをすべて追加します（例：-ロギング構成とURL）。これはあらゆる設計構造に適合し、将来的にも役立ちます

configuration.ts

export class Configuration {

   isInProductionMode : bool = true;

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

//スタートアップコードで使用します（main.tsまたはシードプロジェクトの設計と同等のもの）

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

environment.tsファイルで、本番環境をtrueに設定します

export const environment = {
  production: true
};

ng build --prod environment.tsをenvironment.prod.tsに置き換えます

ng build --prod

私のAngular 2プロジェクトには、他の回答で述べた「main.ts」ファイルはありませんが、「boot.ts」ファイルはありますが、これはほぼ同じようです。（違いはおそらくAngularのバージョンの違いによるものです。）

import「boot.ts」の最後のディレクティブの後に次の2行を追加すると、うまくいきました。

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