Deploy ionic app as a website

ionic-v1
40

I’m a developer on one of the apps @linjeffmn mentioned above. We’re hosting our web version on Heroku. I used the following Node.js buildpack:

The main challenge was figuring out how to set up environment specific variables that I could use in the app. In package.json I have the following entry:

"scripts": {
  "postinstall": "./node_modules/.bin/gulp config"
}

And in gulpfile.js:

gulp.task('config', function () {
  var env = sh.env['NODE_ENV'];
  var src = "envs/" + env + "/config.json";  
  gulp.src(src)
    .pipe(ngConstant({
      name: 'myapp.config'
    }))
    .pipe(gulp.dest('www/js'));
});

I then have /envs/[environment name] folders each with a config.json that contains any environment-specific config vars:

{
    "MY_VAR": "something"
}

At the top of app.js, I can then require it so those variables are injectable:

angular.module('myapp', ['ionic', 'myapp.config'])

I also hid certain functionality in the web version that obviously didn’t make sense, like notifications. Pretty straightforward:

$scope.isWeb = (typeof window.plugin === "undefined");

Again this is not exactly recommended, but worked for our needs.

3 Likes