Using MomentJS in new OWA model

@raff (and others),

So I’m working on creating a couple widgets for displaying/editing programs. I’ve been doing this within coreapps and have been using the new “contrib-uicommons” library (it’s been great to use, thanks again for everyone who worked on it).

I’ve been using bootstrap in my new widget, and have been able to pull it in directly because it is (I think) included in “contrib-uicommons”.

I’d also like to start using MomentJS, as it’s been great for manipulating dates. The moment.js library is already in the (old) UI Commons module, but I’m assuming we’d like to start using the new paradigm. Does it make sense to bundle MomentJS in the “contrib-uicommons” library the way ui.bootstrap is? There appears to be a “angular-moment” library that should make this possible:

If we do want to include it, what is the proper way? I added it to the package.json in contrib-uicommons so that Node pulls it in when I run a “npm install”, but when do a “npm run build” it doesn’t appear to end up in the “contrib-uicommons” library. I’m assuming this is because it needs to be explicitly included at some point.

Hope these questions make some sense… I think I’m in the “I know just enough to be dangerous” state in my knowledge of webpack… :slight_smile:

Take care, Mark

1 Like

It only makes sense to include MomentJS in contrib-uicommons, if you are going to use it in contrib-uicommons e.g. by integrating it with the chooseLanguage component.

You are correct that webpack will only bundle it, if you require/import the module (webpack is clever enough not to bundle code, which is not used).

If you want to use it only in your widget then import it there. I know it’s not that easy yet for dashboard widgets and I’m sorry for the delay with moving dashboard widgets to be built with webpack. I needed to read up on bundling libraries with webpack to make adjustments to contrib-uicommons. Hopefully I will get this done today.

MomentJS can be included in contrib-uicommons at any point in the future and webpack will be able to discover that when building your widget and won’t bundle it twice.

Hope that helps!

That makes total sense @raff, thanks!

I’m not blocked on this currently, lots of other components of this widget I can work on, so I can wait until you are able to get the dashboard widgets running via webpack. As an fyi, I’ve got another program overview widget work-in-progrss in a branch that I’ve been developing over the past week or so… I figured once you moved the other dashboard figured to webpack, I can follow the pattern with the program overview widget and try to incorporate moment at that point.

Take care, Mark

I’m finally getting back to this myself now… @raff any updates on this? I realize that you’ve been busy with a lot of ther priorities regarding the Ref App release, etc. Let me know if there’s anything I can do to help.

Take care, Mark

Yes, sorry for another delay. I’m picking this up today. I’ll appreciate you testing the solution before merging. I’ll ping you via PR.

Thanks! And no problem, I can test…