Làm thế nào để kích hoạt chế độ sản xuất ở góc 2

Question

Tôi mới đến Angular2, tôi đã đọc câu hỏi giải quyết và tôi thấy điều này

Angular2 method binding error: "value has changed after it was checked"

mà là rất thú vị, nhưng câu hỏi của tôi là làm thế nào tôi có thể thay đổi từ phát triển để sản xuất, Nó là có sự khác biệt sau khi đọc câu hỏi này

What is difference between production and development mode in Angular2?

tôi đã tìm kiếm nhưng không thấy gì để chỉ ra rằng chế độ, và nơi bạn có để chỉ chế độ (phát triển) hoặc chế độ (sản xuất).

trong bảng điều khiển Tôi có thể thấy ....Call enableProdMode() to enable the production mode. nhưng ở đâu trong System.config({ hoặc trong các lớp thành phần.

Có cần nhập cụ thể không?

Answer 1

Bạn kích hoạt nó bằng cách nhập và thực hiện các chức năng (trước khi gọi bootstrap):

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

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

Nhưng lỗi này là chỉ báo rằng có điều gì đó sai trái với cam kết ràng buộc của bạn, vì vậy bạn không nên chỉ bỏ qua nó, nhưng cố gắng để tìm ra lý do tại sao nó xảy ra.

Answer 2

này đã làm việc cho tôi, bằng cách sử dụng phiên bản mới nhất của góc 2 (2.0.0-rc.1):

main.ts

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

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

Đây là tài liệu tham khảo chức năng từ tài liệu của họ : https://angular.io/api/core/enableProdMode

Answer 3

Cách tốt nhất để bật chế độ sản xuất cho ứng dụng Góc 2, là sử dụng angular-cli và tạo ứng dụng với ng build -prod. Điều này sẽ xây dựng ứng dụng với hồ sơ sản xuất. Sử dụng angular-cli có lợi ích khi có thể sử dụng chế độ phát triển bằng cách sử dụng ng serve hoặc ng build trong khi phát triển mà không phải thay đổi mã mọi lúc.

Answer 4

Khi tôi xây dựng một dự án mới bằng angular-cli. Một tệp được bao gồm có tên là environment.ts. Bên trong tập tin này là một biến như vậy.

export const environment = { 
    production: true 
}; 

Sau đó, trong main.ts bạn có điều này.

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

Bạn có thể thêm video này vào một dự án phi góc-cli, tôi sẽ giả định, bởi vì enableProdMode() đang được nhập khẩu từ @ góc/lõi.

Answer 5

Đối với những người làm con đường nâng cấp mà không có cũng chuyển sang sử dụng nguyên cảo:

ng.core.enableProdMode() 

Đối với tôi (trong javascript) này trông giống như:

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

Answer 6

dự án kiễu góc 2 của tôi không có tệp "main.ts" đã đề cập đến các câu trả lời khác, nhưng nó có một "khởi động.ts "tập tin, mà dường như là về cùng một điều. (Sự khác biệt có lẽ là do các phiên bản khác nhau của Angular.)

Thêm hai dòng sau khi chỉ thị import cuối cùng làm việc cho tôi:

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

Answer 7

đến src/enviroments/enviroments.ts và kích hoạt chế độ sản xuất

export const environment = { 
    production: true 
}; 

cho góc 2

Answer 8

Bạn không cần bất kỳ tệp môi trường nào hoặc tệp đó sẽ được cung cấp bởi dự án hạt giống của bạn. Chỉ cần có một configuration.ts và thêm vào tất cả các mục yêu cầu quyết định thời gian chạy (ví dụ: - cấu hình ghi nhật ký và các url). Điều này sẽ phù hợp với bất kỳ cấu trúc thiết kế và cũng giúp đỡ trong tương lai

configuration.ts

export class Configuration { 

    isInProductionMode : bool = true; 

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

// Bây giờ sử dụng trong mã khởi động (main.ts của bạn hoặc tương đương theo thiết kế dự án hạt

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

Answer 9

Hầu hết các chế độ thời gian sản là không cần thiết trong suốt thời gian phát triển. Vì vậy, cách giải quyết của chúng tôi là chỉ cho phép nó khi nó là kHÔNG localhost.

Trong trình duyệt của bạn main.ts nơi bạn xác định AppModule gốc của bạn:

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

Các isLocal cũng có thể được sử dụng cho các mục đích khác như enableTracing cho RouterModule cho tốt hơn gỡ lỗi stack trace trong giai đoạn dev.

Answer 10

Khi ng lệnh xây dựng được sử dụng nó ghi đè lên tập tin environment.ts

Theo mặc định khi ng xây dựng lệnh được sử dụng nó thiết lập dev môi trường

Để sử dụng môi trường sản xuất, sử dụng sau lệnh ng xây dựng - -env = prod

này sẽ kích hoạt chế độ sản xuất và tự động cập nhật tập tin environment.ts