AngularJs: Show version number from either git or bower

Question

I have created an Angular application where I want to show the current version number of my application on screen. Currently I have implemented it as a constant:

application
    .constant('constants', {
        VERSION: '1.1.2'
    });

But this will require me to update the constant on every new version. I use bower and git and I was wondering if there was any way to get the version number as a variable from one of these packages dynamically?

Answer 1

Solution is to use Gulp and gulp-ng-constant plugin. It will automate your release workflow, write version of your app in Angular constant service.

• Install Gulp
• Install gulp-ng-constant
• Write your gulp task like following and run it gulp constants:

var gulp = require('gulp');
var ngConstant = require('gulp-ng-constant');

gulp.task('constants', function() {
  // get version from bower file
  var bower = require('./bower.json');
  // set version to ng contants
  var constants = { version: bower.version };

  return ngConstant({
      constants: constants,
      stream: true,
      name: 'app.constants'
    })
    // save ngConstant.js to src/app/
    .pipe(gulp.dest('./src/app'));
});

It will generate angular.module for you as following:

angular.module("app.constants", [])
  .constant("version", "0.0.1")

And the last step you need is to inject your generated constant service in your main app:

var app = angular.module('app', ['app.constants']);

You may be also interested in use gulp-bump task to automatically increment your app version before it will be added to ng-constant service.

See following tutorial: Versioning Your Angular Application with Gulp