Pesquisa de site

javascript - Chamadas de função em produção do Angular 6 não são suportadas em decoradores, mas '..Module' foi chamado

Eu tenho esse erro ao tentar usar angular2-json-schema-form & construir em prod

ERRO durante a compilação do template de 'DemoModule' Chamadas de função não são suportadas em decoradores, mas 'JsonSchemaFormModule' foi chamado. Descobri que o erro vem de:

@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 ]
})

No código-fonte da biblioteca eles usam algo assim:

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
      ]
    };
  }
}

Quando eu removo a variável loadFramworks eu não tenho o erro, mas não consigo injetar os frameworks no atributo providers

Resposta #1

É um problema com AOT, como a outra resposta diz. As funções que são chamadas em um decorador como @NgModule devem ser passíveis de análise estática pelo compilador. Os requisitos exatos para isso são complicados, pois dependem de vários fatores e das versões das bibliotecas e ferramentas em uso.

Quando a função problemática está em uma biblioteca que você possui, há espaço para ação. No meu caso, por exemplo, resolvi remover todas as variáveis locais da função, reduzindo-a a uma única instrução de retorno de uma expressão complexa sem chamadas de função exceto RouterModule.forRoot, que se sabe que funciona. Veja, por exemplo, o commit "make withConfig AOT compatible" no projeto Angular Flex Layout. Brincar com as opções do compilador Angular em tsconfig.lib.json também é documentado como funcionando por alguns comentadores nas issues do GitHub do Angular.

No seu caso, porém, parece que você não está no controle do módulo e da função problemáticos. Você definitivamente deve relatar isso aos desenvolvedores do módulo.

Resposta #2

Eu tive o mesmo problema quando compilei com aot=true. Primeiro você precisa carregar o módulo Bootstrap4FrameworkModule.

O método de solução que encontrei:

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{}

Artigos relacionados