time-ago-pipe | An Angular pipe for converting a date string into a time | Build Tool library

I have recently updated my angular app from V8 to V9 using this guide provided by the official Angular site. I followed all the steps from the guide and the app was successfully updated, but now when I try to build, I get loads of errors related to pipes directives and even components that I am using in my templates.

Here's one example for errors on pipes:

Cannot declare 'TimeAgoPipe' in an NgModule as it's not a part of the current compilation.

Another example of errors on directives:

Can't bind to 'ngModel' since it isn't a known property of 'input'

This code worked perfectly fine on Angular 8:

When I am trying to run npm run ionic:build --prod, it is giving me below errors:

Error: Cannot determine the module for class OverlayPortal in F:/D/IONIC/quicktask/quicktask-web-froala/node_modules/ionic-angular/umd/components/app/overlay-portal.d.ts! Add OverlayPortal to the NgModule to fix it. Cannot determine the module for class IonicApp in F:/D/IONIC/quicktask/quicktask-web-froala/node_modules/ionic-angular/umd/components/app/app-root.d.ts! Add IonicApp to the NgModule to fix it. Cannot determine the module for class ClickBlock in F:/D/IONIC/quicktask/quicktask-web-froala/node_modules/ionic-angular/umd/components/app/click-block.d.ts! Add ClickBlock to the NgModule to fix it. Cannot determine the module for class Slides in F:/D/IONIC/quicktask/quicktask-web-froala/node_modules/ionic-angular/umd/components/slides/slides.d.ts! Add Slides to the NgModule to fix it.

Now if I try to include it in app.module.ts using below code:

Brief explanation: My server is returning date, time in below format -

I have a twitter look like app where user can enter comments in angular user can enter a comment , the comment display automaticaly and diplays a date it was added, I want comments added to be displayed after the old comments, now new comments display before old comments.

Check this: when user submit the comment displays like this,

What I want is the old comment should be on top and the new comment at the bottom Inshort what I want is vice versa of the image above.

Here is my solution , Note am momet js for date formating

function to add and get comments in ts

I have app in angular user can enter a comment , the comment display automaticaly and diplays a date it was added, the weird part is as following

1. When a user enter a coment here is what is displayed (check time)

The first commet is from yesterday, the second coment is new one u can see after submiting dispaly a date an hour ago instead of just now? .

1. When user refresh the browser here is what is displayed check the top comment time?

What I want is the old comment should be on top and the new comment at the bottom and new comment should have time just now imeaditely not after refresh

Here is my solution , Note am momet js for date formating

function to add and get comments in ts

package.json Angular6:

I am using time-ago-pipe version 1.3.2 with angular 4.4. But now to build for production, I receive the following error,

When I tried to run ng serve it runs without any error, but when I tried to create a production build using 'ng build --prod' it stopped with error below. I tried to tweak with the version still no success. Then some other issue occurred like other API version compatibility issue. Any help will be highly appreciated.

ERROR in ./src/main.ts Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in 'D:\000PS\workspace_ui\dashboard\src' ERROR in Error: Metadata version mismatch for module D:/000PS/workspace_ui/dashboard/node_modules/ngx-pipes/src/app/index.d.ts, found version 4, expected 3 at StaticSymbolResolver.getModuleMetadata (D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler\bundles\compiler.umd.js:25755:34) at StaticSymbolResolver._createSymbolsOf (D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler\bundles\compiler.umd.js:25543:46) at StaticSymbolResolver.getSymbolsOf (D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler\bundles\compiler.umd.js:25524:14) at D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler\bundles\compiler.umd.js:24381:30 at Array.forEach () at extractProgramSymbols (D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler\bundles\compiler.umd.js:24380:79) at AotCompiler.analyzeModulesAsync (D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler\bundles\compiler.umd.js:23936:47) at CodeGenerator.codegen (D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler-cli\src\codegen.js:32:14) at Function.NgTools_InternalApi_NG_2.codeGen (D:\000PS\workspace_ui\dashboard\node_modules\@angular\compiler-cli\src\ngtools_api.js:73:30) at _donePromise.Promise.resolve.then (D:\000PS\workspace_ui\dashboard\node_modules\@ngtools\webpack\src\plugin.js:428:58) at at process._tickCallback (internal/process/next_tick.js:188:7)

Please find package.json for reference:

When I am trying to run my app, it is saying

Type IonicApp is part of the declarations of 2 modules: IonicModule and AppModule! Please consider moving IonicApp to a higher module that imports IonicModule and AppModule. You can also create a new NgModule that exports and includes IonicApp then import that NgModule in IonicModule and AppModule.

How do I get rid of this error ?

Copying entire error coming in console below:

ionic-app-script task: "build" [11:51:25] Error: Type IonicApp in F:/D/IONIC/quicktask/quicktask-web-froala - test/node_modules/ionic-angular/components/app/app-root.d.ts is part of the declarations of 2 modules: IonicModule in F:/D/IONIC/quicktask/quicktask-web-froala - test/node_modules/ionic-angular/module.d.ts and AppModule in F:/D/IONIC/quicktask/quicktask-web-froala - test/src/app/app.module.ts! Please consider moving IonicApp in F:/D/IONIC/quicktask/quicktask-web-froala - test/node_modules/ionic-angular/components/app/app-root.d.ts to a higher module that imports IonicModule in F:/D/IONIC/quicktask/quicktask-web-froala - test/node_modules/ionic-angular/module.d.ts and AppModule in F:/D/IONIC/quicktask/quicktask-web-froala - test/src/app/app.module.ts. You can also create a new NgModule that exports and includes IonicApp in F:/D/IONIC/quicktask/quicktask-web-froala - test/node_modules/ionic-angular/components/app/app-root.d.ts then import that NgModule in IonicModule in F:/D/IONIC/quicktask/quicktask-web-froala - test/node_modules/ionic-angular/module.d.ts and AppModule in F:/D/IONIC/quicktask/quicktask-web-froala - test/src/app/app.module.ts.

What should I do?

app.module.ts