Getting started with publishing your new AngularJS module to GitHub and Bower can be tough. But it's okay, we'll figure it out together. Below I have outlined the key steps taken to publish my own first bower component found here: https://github.com/codehangar/ng-copy-text.
Step 1
Make your AngularJS module
If you made your way to this post, you have probably already created an angular directive or service for an existing project, and like me, are looking for the most painless path to turn your directive in a bower component.
Initializing
Let's start with creating a new directory.
mkdir my-module-name && cd $_
Avoid re-inventing the wheel, and find an example or seed project.
I originally used https://github.com/refactorthis/angular-component-seed. Although you could start with my modified one as well
git clone [email protected]:codehangar/ng-copy-text.git
# install dependencies
npm install
bower install
Customizing
- Update the source files with your angular module, which, depending on which repo you forked will be located in:
/src
(ng-copy-text) or/component
(angular-component-seed)
- Be sure to update the following to match your module name
package.json
andbower.json
.
- And also update
build.conf.js
here:
{
...
buildJsFilename: 'your-file-name.js',
...
}
Step 2
Publish on GitHub
Create a new repo on GitHub
https://help.github.com/articles/create-a-repo/
Step 3
Push to Bower registry
Actually, you can begin using your module in other projects now.
bower install your-github-name/your-ng-module
I did this at first to test installing and using the directive in a separate project.
Once you are ready to publish it to the official bower registry:
bower register your-ng-module [email protected]:your-github-name/your-repo-name.git
- Include
private: false
as a field in yourbower.json
in order forbower register
to work.
Pushing Releases
- Be sure to run
gulp build
(this will produce the minified versions of your module to thedist
folder. - Update your version number inside of
bower.json
. Bower expects Semantic Versioning guidelines to be followed. - Tagging your git commit with the version number (i.e.
v0.0.1
) will produce a GitHub Release. - Bower references your GitHub Releases as installable versions of your module
# Credits http://briantford.com/blog/angular-bower
About Author: Ian Grail
Software Developer. Aspiring Pool Lounger.