web-dev-qa-db-ja.com

ng build --prod（AOT）の間、関数呼び出しはデコレーターではサポートされません

問題のタイプ：バグ/質問

説明

ライブラリをjsにコンパイルするためにng-packagr libを使用しています。問題なくすべてをコンパイルしましたが、ng build --prod（AOTが有効）でライブラリを使用したい場合、エラーが発生します。

ERROR in Error during template compile of 'AppModule' Function calls are not supported in decorators but 'BsDropdownModule' was called.

.forRootメソッドを削除すると、エラーが発生します。

ERROR in : Unexpected value 'BsDropdownModule in /home/sf/Desktop/Developerka/kompilacja/final/sample-repo/node_modules/angular-library-name/free/dropdown/dropdown.module.d.ts' imported by the module 'AppModule in /home/sf/Desktop/Developerka/kompilacja/final/sample-repo/src/app/app.module.ts'. Please add a @NgModule annotation

その点に注意してください ng --prod --aot=falseはエラーを生成していません。

再現方法：

リポジトリをダウンロード： https://github.com/Bloodcast69/aot-error 、タイプnpm install ng build --prod.

予想される動作

エラーなしでAOTでビルドしたい（Angular Universal）と互換性があるようにする必要がある）バージョン情報

ng-packagr: 2.4.1 @angular/*: 5.2.9 TypeScript: 2.5.3 rxjs: 5.5.6 node: 8.1.0 npm/yarn: npm: 5.6.0

ファイル：

app.module.ts：

import { BsDropdownModule } from 'angular-library-name';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';



import { AppComponent } from './app.component';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BsDropdownModule.forRoot(),
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

dropdown.module.d.ts：

import { ModuleWithProviders } from '@angular/core';
export declare class BsDropdownModule {
    static forRoot(config?: any): ModuleWithProviders;
}

dropdown.module.ts（JSへのコンパイル前）：

import { ModuleWithProviders, NgModule } from '@angular/core';
import { ComponentLoaderFactory } from '../utils/component-loader/index';

import { PositioningService } from '../utils/positioning/index';
import { BsDropdownContainerComponent } from './dropdown-container.component';
import { BsDropdownMenuDirective } from './dropdown-menu.directive';
import { BsDropdownToggleDirective } from './dropdown-toggle.directive';
import { BsDropdownConfig } from './dropdown.config';

import { BsDropdownDirective } from './dropdown.directive';
import { BsDropdownState } from './dropdown.state';

@NgModule({
  declarations: [
  BsDropdownMenuDirective,
  BsDropdownToggleDirective,
  BsDropdownContainerComponent,
  BsDropdownDirective
  ],
  exports: [
  BsDropdownMenuDirective,
  BsDropdownToggleDirective,
  BsDropdownDirective
  ],
  entryComponents: [BsDropdownContainerComponent]
})
export class BsDropdownModule {
  public static forRoot(config?: any): ModuleWithProviders {
    return {
      ngModule: BsDropdownModule, providers: [
      ComponentLoaderFactory,
      PositioningService,
      BsDropdownState,
      {provide: BsDropdownConfig, useValue: config ? config : {autoClose: true}}
      ]
    };
  };
}

[〜＃〜]注[〜＃〜]私はインターネット全体を読んで、自分にとって役立つ何かを見つけましたが、成功しませんでした。私はこのトピックをチェックしました：

静的forRootに引数がある場合、AOTビルド中にFeatureModuleが失敗します

https://github.com/angular/angular/issues/14707

必要な情報が不足している場合はお知らせください。提供いたします。

ありがとう、Bloodcast69

angulartypescriptangular2-aotangular-universalng-packagr
8
Bloodcast69

これはAOTの問題です。forRoot関数はコンパイル時に実行する必要があります。 Angularのより最近のバージョンでは、そのまま動作するはずです。そうでなければ、tsconfig.app.json。この関連する質問を確認してください： Angular 6 Prod関数呼び出しはデコレーターではサポートされていませんが、「.. Module」が呼び出されました

2
Alessio Stalla

私も同じ問題に直面しています。ng-packagrに絞り込むことができました。ライブラリからモジュールを抽出し、AOTエラーに直面しなかった別のアプリケーションでテストしました。ライブラリにモジュールをパッケージ化したときにのみこのエラーが発生します

Angular 6.1.8およびng-packagr 4.2.0を使用しています。

0
Sameh

forRootメソッドはModuleWithProvidersを返し、@NgModuleで注釈を付ける必要があります

  import { ModuleWithProviders, NgModule } from '@angular/core';

    @NgModule({
        declarations: [],
        imports: [],
        providers: [],

      })
    export class BsDropdownModule {
       // constructor(parentModule: BsDropdownModule);
        //  static forRoot(config?: any): ModuleWithProviders;
        static forRoot(config?: any): ModuleWithProviders {

            return {
                ngModule: BsDropdownModule,
                providers: [
                ]
            }
        }
    }

したがって、宣言ファイルdropdown.moduleではなくapp.moduleにdropdown.module.d.tsをインポートする必要があります

import { BsDropdownModule } from './dropdown.module';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BsDropdownModule.forRoot(),
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

AOTビルドでテストしました。エラーなし

0
Yerkon