Angular + NPM: Publish your AngularJS modules to npm
This is an attempt to show how to share angular modules on npm, and use npm modules from angular directives. It may look rough at edges, but I hope we can level it with your help.
Let's say we need a typeahead control from angular-ui bootstrap. How do we start using it?
- Go to http://angular-ui.github.io/bootstrap/
- Click "Create Build" and choose "Typeahead"
- Download the build, unpack the archive and put it into your project folder
*.htmlfile to include
*.jsfile to include 'ui.bootstrap' as a dependency of your main module.
Things get worse when you want to update typeahead directive, or decide that you need typeahead plus something else. Maybe I'm missing something and there is an easier way to get this done? Please let me know.
Wouldn't it be nicer if we could do:
npm install typeahead
- Use it.
The idea is simple: avoid using
angular.module in npm package, and delay directives registration up to the point when application is bootstrapped.
E.g. instead of doing:
var myModule = angularmodule??? ;myModuledirective??? /* */;
When you ready to bootstrap application, collect all directives and register them in your main application module:
This approach is still not perfect and requires certain discipline to not forget register your directives via
an. I can also see potential problems with names collision, versioning (especially when
an itself is updated). This module is really simple at the moment, and maybe there is a better way of sharing angular directives on npm. Please let me know.
With npm do:
npm install an