feat(environments): configuration via process.env.VAR replacement (#1471

)

README.md

@@ -52,6 +52,19 @@ To run the `build` script found in the `package.json` `scripts` property, execut
 npm run build
 ```
 
+## Environments
+
+You can use Node style `process.env.MY_VAR` syntax directly in your typescript
+and when the application is bundled it'll be replaced with the following order of precedence:
+* If the variable exists in the process environment it will be replaced with that value.
+* If the variable is not defined in the process environment it will be read from a `.env.dev`
+file for dev builds or `.env.prod` file for prod builds which are located in the root of the app
+* If the variable is not defined in either place it will be `undefined`
+
+In order to take advantage of this apps will need a `src/declarations.d.ts` file with the following declaration:
+```typescript
+declare var process: { env: { [key: string]: string | undefined; } };
+```
 
 ## Custom Configuration
 

config/webpack.config.js

@@ -10,6 +10,7 @@
 var path = require('path');
 var webpack = require('webpack');
 var ionicWebpackFactory = require(process.env.IONIC_WEBPACK_FACTORY);
+const Dotenv = require('dotenv-webpack');
 
 var ModuleConcatPlugin = require('webpack/lib/optimize/ModuleConcatenationPlugin');
 var PurifyPlugin = require('@angular-devkit/build-optimizer').PurifyPlugin;
@@ -91,6 +92,11 @@ var devConfig = {
   },
 
   plugins: [
+    new Dotenv({
+      path: '.env.dev', // load this now instead of the ones in '.env'
+      systemvars: true, // load all the predefined 'process.env' variables which will trump anything local per dotenv specs.
+      silent: true // hide any errors
+    }),
     ionicWebpackFactory.getIonicEnvironmentPlugin(),
     ionicWebpackFactory.getCommonChunksPlugin()
   ],
@@ -124,6 +130,11 @@ var prodConfig = {
   },
 
   plugins: [
+    new Dotenv({
+      path: '.env.prod', // load this now instead of the ones in '.env'
+      systemvars: true, // load all the predefined 'process.env' variables which will trump anything local per dotenv specs.
+      silent: true // hide any errors
+    }),
     ionicWebpackFactory.getIonicEnvironmentPlugin(),
     ionicWebpackFactory.getCommonChunksPlugin(),
     new ModuleConcatPlugin(),

package.json

@@ -37,6 +37,7 @@
     "chokidar": "^1.7.0",
     "clean-css": "^4.1.11",
     "cross-spawn": "^5.1.0",
+    "dotenv-webpack": "^1.5.7",
     "express": "^4.16.3",
     "fs-extra": "^4.0.2",
     "glob": "^7.1.2",