web-dev-qa-db-ja.com

コンポーネントのモジュールを特定できませんangular 5

「ng build --prod」を使用してAngularアプリをビルドすると、次のエラーが発生します。これは、Angular 4 error with Angular 5. With Angular 5 "ng serve"は完全に機能しています。

エラーのエラー：mypath/node_modules/time-ago-pipe/time-ago-pipe.tsでクラスTimeAgoPipeのモジュールを特定できません！ TimeAgoPipeをNgModuleに追加して修正します。

https://www.npmjs.com/package/time-ago-pipe のエラーを取得しています

解決策はありますか？

angularangular5
18
user2609021

大文字と小文字の区別を確認

import { MyComponent } from "./User/my-component";

私の場合、問題はインポートステートメントでUを大文字としてフォルダーユーザーが作成されたことです。しかし、実際にはディスク上では小さなケースでした。 importステートメントでフォルダーの名前を（小文字で）ユーザーに変更したときも、うまくいきました。

import { MyComponent } from "./user/my-component";

インポートパスの大文字と小文字の区別を確認してください。

21
Anand Murali

Angular 5および特にangular cli 1.5は事前にコンパイルが有効になっているため、プロジェクトフォルダーで見つけるすべてのコンポーネント/パイプなどのモジュールを知っている必要があります。エラーがスローされるモジュールでは宣言されていません。

いくつかのモジュールでTimeAgoPipeを宣言できます：

@NgModule({
  declarations: [TimeAgoPipe, ...]
})
export class AppModule {}// for example can be any other used module

または事前にコンパイルせずにビルドを実行してみてください結果のコードは遅くなります

ng build --prod --aot=false

3番目の方法は、そのパイプをまったく使用しない場合は、tsconfig.jsonの除外ファイルに追加できます。

{
  ...
  "exclude": [ "path/to/unused/component.ts", ... ]
}
13
Xesenix

私の場合、エラーはさまざまなファイルの同じクラスの複数の定義が原因でした。これは、一部の開発者によるコードのコピーと貼り付けが原因で発生しました。

5
aCiD

私はまったく同じ問題を抱えており、回避策を提供できますが、この特定のパイプがaotビルドで正常にピックアップされない理由はわかりません：

回避策

Node-modules/time-ago-pipeからtime-ago-pipe.tsをコピーし、このファイルを自分のプロジェクトにコピーします。

それを通常どおりモジュールの宣言に追加し、これをインポートにインポートします：

import { TimeAgoPipe } from './_pipes/time-ago-pipe';

これにより、AOTビルドで正常にコンパイルされ、引き続きパイプを使用できます。

4
James c

私の場合、何らかの理由でmypipe.tsとapp.component.tsで独自のクラスとして宣言されたパイプがありました。 app.componentにあるものを削除すると、正常にコンパイルされました。

エラーメッセージで、文句を言っている箇所を正確に確認し、それがプロジェクトのダブルコードであるかどうかを確認します。

0
mneumann
  1. 特定のコンポーネントをインポートします。
  2. @NgModuleにコンポーネントを追加します。
0
Viranja kaushalya

私の場合、同じ名前のコンポーネントが2つありました。それらの1つを削除し、修正されました。

0
ddagsan

また、prodビルドでのみ同じエラーが発生しましたが、devビルドでは発生しませんでした。 app.module.tsにcomponent.tsファイルをインポートしましたが、NgModuleでは使用しませんでした。それでインポートを削除しましたが、うまくいきました。

0
Ganesh

私にとっては、宣言の中にコンポーネントがあったとしても機能しませんでした。そのため、宣言とインポートからコンポーネントを削除しました。そして、Visual Studioのコードintellisenseを使用して宣言内のコンポーネント名を自動補完し、自動インポートを使用してモジュールファイルの上部にあるコンポーネントをインポートすることにより、それを再構築しました。そして驚いたことに、うまくいきました。

上記の解決策のいずれかがうまくいかなかった場合、これも試してみる価値があります。

0
p4ulinux

私にとっては、問題はインポートパスで大文字と小文字が区別されていました。ただし、問題のあるすべてのインポートパスを見つける必要があります。モジュールで使用されているものをインポートするだけではありません。

0
Amir Aghajani