web-dev-qa-db-ja.com

Angular 6 Prod関数呼び出しはデコレータではサポートされていませんが、 '.. Module'が呼び出されました

製品でangular2-json-schema-form＆buildを使用しようとすると、このエラーが発生します

'DemoModule'のテンプレートコンパイル中のエラーのエラー関数呼び出しはデコレーターでサポートされていませんが、 'JsonSchemaFormModule'が呼び出されました。エラーが原因であることがわかりました：

@NgModule({
  declarations: [ AceEditorDirective, DemoComponent, DemoRootComponent ],
  imports: [
    BrowserModule, BrowserAnimationsModule, FlexLayoutModule, FormsModule,
    HttpClientModule, MatButtonModule, MatCardModule, MatCheckboxModule,
    MatIconModule, MatMenuModule, MatSelectModule, MatToolbarModule,
    RouterModule.forRoot(routes),

    NoFrameworkModule, MaterialDesignFrameworkModule,
    Bootstrap3FrameworkModule, Bootstrap4FrameworkModule,

    JsonSchemaFormModule.forRoot(   // the source of the Error
      NoFrameworkModule,
      MaterialDesignFrameworkModule,
      Bootstrap3FrameworkModule,
      Bootstrap4FrameworkModule
    )
  ],
  bootstrap: [ DemoRootComponent ]
})

ライブラリのソースコードでは、次のように使用します。

export class JsonSchemaFormModule {
  static forRoot(...frameworks): ModuleWithProviders {
    const loadFrameworks = frameworks.length ?
      frameworks.map(framework => framework.forRoot().providers[0]) :
      [{ provide: Framework, useClass: NoFramework, multi: true }];
    return {
      ngModule: JsonSchemaFormModule,
      providers: [
        JsonSchemaFormService, FrameworkLibraryService, WidgetLibraryService,
        ...loadFrameworks
      ]
    };
  }
}

変数loadFramworksを削除するとエラーは発生しませんが、プロバイダー属性にフレームワークを挿入できないようです

javascriptangulartypescriptangular6angular6-json-schema-form
5
Melchia

他の答えが言うように、それはAOTの問題です。 @NgModuleのようなデコレータで呼び出される関数は、コンパイラによる静的分析に対応できる必要があります。それらの正確な要件は、使用しているライブラリとツールの多くの要因とバージョンに依存するため、注意が必要です。

問題の関数があなたが所有するライブラリにあるとき、行動の余地があります。たとえば、私の場合、関数からすべてのローカル変数を削除し、機能することがわかっているRouterModule.forRoot以外の関数呼び出しのない複雑な式の単一のreturnステートメントに減らすことにしました。たとえば、Angular Flex Layoutプロジェクト）の commit "make withConfig AOT compatible" を参照してください。angularでのコンパイラオプションの使用tsconfig.lib.jsonは、AngularのGitHubの問題について一部のコメント投稿者によって機能するようにも文書化されています。

しかし、あなたの場合、問題のモジュールと機能を制御していないようです。必ずモジュールの開発者に報告してください。

5
Alessio Stalla

私は同様の問題を抱えていました、以下のこのコードで修正しました。

// @dynamic
@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    MatSnackBarModule
  ]
})
export class VrWidgetsModalModule {
  static forRoot(durationTime: number, position: VrWidgetsModalPositionEnum): ModuleWithProviders {
    return {
      ngModule: VrWidgetsModalModule,
      providers: [
        {provide: VrWidgetsModalService, useFactory: modalFactory, deps: [MatSnackBar, 'DURATION_TIME', 'POSITION']},
        {provide: 'DURATION_TIME', useValue: durationTime},
        {provide: 'POSITION', useValue: position}
      ]
    };
  }
}

export const modalFactory = (modal: MatSnackBar, durationTime: number, modalPosition: VrWidgetsModalPositionEnum) => {
  return new VrWidgetsModalService(modal, durationTime, modalPosition);
};
0
vrapalis

Aot = trueでビルドしたときも同じ問題がありました。まず、モジュールBootstrap 4 Framework Moduleをロードする必要があります。

私が見つけた解決方法：

import { JsonSchemaFormModule, Bootstrap4FrameworkModule, JsonSchemaFormService, FrameworkLibraryService, WidgetLibraryService } from 'angular2-json-schema-form';

@NgModule({
declarations: [
  testComponent
],
import:[
  testRoutingModule,
  Bootstrap4FrameworkModule.forRoot(), {
            ngModule: JsonSchemaFormModule,
            providers: [
                JsonSchemaFormService, FrameworkLibraryService,
                WidgetLibraryService,
            ]
        }

}),
export class testModule{}
0
Ahmet Eldem