How to create reusable Durandal widgets

Question

I'd like to get going on creating my own little library of reusable Durandal widgets.

Thanks to the docs, creating a widget wasn't difficult, but I couldn't find information about how to package / how to import a widget in a way that would naturally integrate with a Durandal project.

More specifically:

1. The "How to create a widget" page tells me to put the code for each widget into a subdirectory of assets/javascripts/app/widgets. I suppose I could do that, but wouldn't it be more natural to use a subdirectory of assets/javascripts/vendor/ so that widgets could be installed by the package manager?

2. How should I provide/package the CSS for my widgets? The mimosa build system which I use automatically includes all the style files under assets/stylesheets, but not those in assets/javascripts/app/widget/<my-widget>, meaning that I would have to split up the files of each of my widgets into two folders.

Of course, these questions are not show-stoppers, and if I can't get good answers here, I will just fall back to using Durandal the way I know it will work.

Yet it would be really helpful if there was a way to package and install widgets into nicely separated and self-containing directory trees. Even without a package manager, widgets could then be kept as git submodules, which would be great especially during development.

Thanks for any assistance!

Answer 1

You could give the mimosa-require-library-package a try. You could toss that in git with a bower.json and use mimosa-bower to pull in the file you are interested in.