Add environment

package.json

@@ -89,5 +89,8 @@
       "android",
       "browser"
     ]
+  },
+  "config": {
+    "ionic_webpack": "./webpack.config.js"
   }
 }

src/app/app.component.ts

@@ -1,4 +1,4 @@
-import {Component, ViewChild} from '@angular/core';
+import {Component, Inject, ViewChild} from '@angular/core';
 import {Config, Nav, Platform} from 'ionic-angular';
 
 import {StatusBar} from '@ionic-native/status-bar';
@@ -15,6 +15,7 @@ import {DolphinsPage} from "../pages/dolphins/dolphins";
 import {SettingsPage} from "../pages/settings/settings";
 import {SiteProvider} from "../providers/site/site";
 import {ReaderPage} from "../pages/reader/reader";
+import {EnvVariables} from "./environment-variables/environment-variables.token";
 
 @Component({
   templateUrl: 'app.html'
@@ -31,9 +32,11 @@ export class MyApp {
 
   constructor(public translate: TranslateService, public platform: Platform,
               public authService: AuthProvider, private config: Config, private statusBar: StatusBar,
-              private splashScreen: SplashScreen, public siteService: SiteProvider) {
+              private splashScreen: SplashScreen, public siteService: SiteProvider,
+              @Inject(EnvVariables) public envVariables) {
     this.initTranslate();
 
+    console.log(this.envVariables.ionicEnvName, envVariables.apiEndpoint);
     this.translate.get(['POSTS', 'TAGS', 'FILES', "READER", 'SETTINGS']).subscribe(values => {
       this.pages = [
         {title: values.POSTS, component: EntriesPage, icon: 'paper'},

src/app/app.module.ts

@@ -44,6 +44,7 @@ import {BaseModelProvider} from '../providers/base-model/base-model';
 import {EditorComponent} from "../components/editor/editor";
 import {ReaderProvider} from '../providers/reader/reader';
 import {ReaderPage} from "../pages/reader/reader";
+import {EnvironmentsModule} from "./environment-variables/environment-variables.module";
 
 // The translate loader needs to know where to load i18n files
 // in Ionic's static asset pipeline.
@@ -96,6 +97,7 @@ export function provideSettings(storage: Storage) {
       }
     }),
     IonicModule.forRoot(MyApp),
+    EnvironmentsModule,
     IonicStorageModule.forRoot()
   ],
   bootstrap: [IonicApp],

src/app/environment-variables/development.ts

@@ -0,0 +1,5 @@
+export const devVariables = {
+  apiEndpoint: 'http://draft.gonevis.com/api/v1',
+  environmentName: 'Development Environment',
+  ionicEnvName: 'dev'
+};

src/app/environment-variables/environment-variables.module.ts

@@ -0,0 +1,22 @@
+import {NgModule} from '@angular/core';
+import {EnvVariables} from './environment-variables.token';
+import {devVariables} from './development';
+import {prodVariables} from './production';
+
+declare const process: any; // Typescript compiler will complain without this
+
+export function environmentFactory() {
+  return process.env.IONIC_ENV === 'prod' ? prodVariables : devVariables;
+}
+
+@NgModule({
+  providers: [
+    {
+      provide: EnvVariables,
+      // useFactory instead of useValue so we can easily add more logic as needed.
+      useFactory: environmentFactory
+    }
+  ]
+})
+export class EnvironmentsModule {
+}

src/app/environment-variables/environment-variables.token.ts

@@ -0,0 +1,3 @@
+import {OpaqueToken} from "@angular/core";
+
+export let EnvVariables = new OpaqueToken("env.variables");

src/app/environment-variables/production.ts

@@ -0,0 +1,5 @@
+export const prodVariables = {
+  apiEndpoint: 'https://www.gonevis.com/api/v1',
+  environmentName: 'Production Environment',
+  ionicEnvName: 'prod'
+};

webpack.config.js

@@ -0,0 +1,57 @@
+var path = require('path');
+var webpack = require('webpack');
+var ionicWebpackFactory = require(process.env.IONIC_WEBPACK_FACTORY);
+
+var ModuleConcatPlugin = require('webpack/lib/optimize/ModuleConcatenationPlugin');
+
+var prodPlugins = [];
+if (process.env.IONIC_ENV === 'prod') {
+  prodPlugins.push(new ModuleConcatPlugin());
+}
+
+module.exports = {
+  entry: process.env.IONIC_APP_ENTRY_POINT,
+  output: {
+    path: '{{BUILD}}',
+    publicPath: 'build/',
+    filename: '[name].js',
+    devtoolModuleFilenameTemplate: ionicWebpackFactory.getSourceMapperFunction(),
+  },
+  devtool: process.env.IONIC_SOURCE_MAP_TYPE,
+
+  resolve: {
+    extensions: ['.ts', '.js', '.json'],
+    modules: [path.resolve('node_modules')]
+  },
+
+  module: {
+    loaders: [
+      {
+        test: /\.json$/,
+        loader: 'json-loader'
+      },
+      {
+        test: /\.ts$/,
+        loader: process.env.IONIC_WEBPACK_LOADER
+      },
+      {
+        test: /\.js$/,
+        loader: process.env.IONIC_WEBPACK_TRANSPILE_LOADER
+      }
+    ]
+  },
+
+  plugins: [
+    ionicWebpackFactory.getIonicEnvironmentPlugin(),
+    new webpack.EnvironmentPlugin(['IONIC_ENV']),
+    ionicWebpackFactory.getCommonChunksPlugin()
+  ],
+
+  // Some libraries import Node modules but don't use them in the browser.
+  // Tell Webpack to provide empty mocks for them so importing them works.
+  node: {
+    fs: 'empty',
+    net: 'empty',
+    tls: 'empty'
+  }
+};