Angular 5 : Function calls are not supported in decorators

Question

我正在从我的 Angular 应用程序构建 PWA，当我运行 ng build --prod 时出现以下错误:

ERROR in app\app.module.ts(108,64): Error during template compile of 'AppModule'
Function calls are not supported in decorators but 'Environment' was called in 'environment'
'environment' calls 'Environment'.

但是，这没有任何意义，因为我在类中添加了 export，您可以在此处看到:

environment.prod.ts

import { BaseEnvironment } from './base-environment';
import { ProspectBuilderModel } from '../app/models/prospect';

export class Environment extends BaseEnvironment {
  production: boolean = true;
  prospectBuilderModel: ProspectBuilderModel = {
    buildQuote: false,
    buildAcknowledge: false,
    buildOrganizationInfo: false,
    buildFinancialInfo: false,
    buildTradeInfo: false,
    buildPermissiblePurpose: false,
    buildUserSetup: false,
    buildPackageSelection: false,
    buildPaymentOptions: false,
    buildOrderOptions: false,
    buildVerifyOrganizationInfo: false,
    buildDocusignAuthorization: false,
    buildDocusignContract: false
  };
}

export const environment = new Environment();

base-environment.ts

import { ProspectBuilderModel } from '../app/models/prospect';

export abstract class BaseEnvironment {
  abstract production: boolean;
  abstract prospectBuilderModel: ProspectBuilderModel;
}

app.module.ts

...
 ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    MultiselectDropdownModule,
    ReactiveFormsModule,
    HttpModule,
    ToastrModule.forRoot(),
    BrowserAnimationsModule,
    NgxMyDatePickerModule.forRoot(),
    PopoverModule.forRoot(),
    ModalModule.forRoot(),
    ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })
  ],
  providers: [
...

有谁知道我可以做些什么来解决这个错误？

Answer 1

有同样的问题，这里有可能的解决方法(如果你没有动态加载的属性):

1。作为你的回答，只是反对。

但是您会丢失默认属性和有关“实现”属性的信息。

2。使用静态类:

这里你失去了“实现”属性，因为抽象静态是not possible ，但您有类型和默认值。

// default.env.ts
export class BaseEnvironment {
  public production: boolean = true;
  public specialPropToImpl: boolean = true;
}

// your.env.ts
export class Environment extends BaseEnvironment {
  public specialPropToImpl = true;
}

export const environment = Environment;

3。使用默认属性对象、接口(interface)和对象赋值:

这里有“实现”属性、类型和默认值，但实现起来有点难看。

// default.env.ts
export interface EnvProperties {
  production: boolean;
  specialPropToImpl: boolean;
}

export const defaultEnv = {
  production: true
};

// your.env.ts
export const environment: EnvProperties = {
  ...defaultEnv,
  specialPropToImpl: true
};

4。来自环境的一个静态变量

简单的解决方案，你保留你的子类，但每个 env 文件都必须有它。但是由于新的环境文件是由旧环境文件的复制粘贴创建的，所以这可以工作。
取决于生产值(value)，您应该手动更改变量值。
不是很灵活和可维护的解决方案。但很简单。

// your.env.ts
export const enablePwa = true

// app.module.ts
import {environment, enablePwa} from 'env.ts'
//...
ServiceWorkerModule.register('/ngsw-worker.js', { enabled: enablePwa })