Angular 为什么构建的应用程序会出现无法启用 prod 模式的错误？

Question

我已经使用 ng build --prod 构建了我的 Angular 应用程序，当我尝试启动它时，出现了一条错误消息：

未捕获的错误：平台设置后无法启用 prod 模式。

在我在服务顶部的api.service.ts 中，我使用isDevMode() 以防我在本地主机上进行测试：

if (isDevMode()) {
  httpOptions = {
    headers: new HttpHeaders({
      'Content-Type':  'application/json',
      // 'Authorization': "Basic " + btoa(user + ":" + password),
      'Authorization': `Basic ${btoa(`${user}:${password}`)}`,
      'Access-Control-Allow-Origin': '*'
    })
  };
} else {
  httpOptions = {
    headers: new HttpHeaders({
      'Content-Type':  'application/json',
      'Access-Control-Allow-Origin': '*'

    })
  };
}

main.ts:

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

在environment.ts：

export const environment = {
  production: false
};

我试图在堆栈溢出中检查这个post，但没有任何结果，这个帖子在github 上。

编辑

environment.prod.ts：

export const environment = {
  production: true
};

Answer 1

您不能在调用enableProdMode 之前调用isDevMode()（请参阅here）。

在调用enableProdMode 之前，您将在main.ts 文件中导入AppModule。该导入将依次导入您的服务文件，据我了解，该文件在课堂外检查了isDevMode。

尝试在您的服务构造函数中移动httpOptions 的初始化。

注意如果变量是静态的并且在声明时已初始化，您将遇到同样的问题。

如果你想把初始化留在类之外，你可以检查你的环境

import { environment } from './environments/environment';

 if (environment.production) {
    httpOptions = {

顺便说一句，标头Access-Control-Allow-Origin 是服务器响应标头，不应在客户端请求中设置。