Environment inheritance example

app_environment_BaseEnvironment.ts

export class BaseEnvironment {
	env: BaseEnvironment.Env
	FirebaseConfig: {
		apiKey: string,
		authDomain: string,
		databaseURL: string,
		projectId: string,
		storageBucket: string,
		messagingSenderId: string
	}
	myOtherSetting: {
		someNumber: number,
		someConstrainedString: 'val1' | 'val2' | 'val3'
	}
}
export module BaseEnvironment {
	export enum Env {
		Dev,
		Stage,
		Prod,
		QA
	}
}

app_environment_DevEnvironment.ts

import { BaseEnvironment } from './BaseEnvironment'

class DevEnvironment extends BaseEnvironment {
	env = BaseEnvironment.Env.Dev
	FirebaseConfig = {
		apiKey: "somekey",
		authDomain: "somedomain",
		databaseURL: "somedb",
		projectId: "someid",
		storageBucket: "somebucket",
		messagingSenderId: "somemessageid"
	}
	myOtherSetting = { // These settings don't validate and will cause a compiler error
		someNumber: 'abc', 
		someConstrainedString: 'value_not_in_list'
	}
}

export const Environment = new DevEnvironment()

app_environment_Environment.ts

import { BaseEnvironment } from './BaseEnvironment'

export const Environment = new BaseEnvironment()

config_webpack.config.js

var webpack = require('webpack')
var merge = require('webpack-merge')

var webpackConfig = require('../node_modules/@ionic/app-scripts/config/webpack.config')

var environmentPath = /\/environment\/Environment$/

module.exports = merge(webpackConfig, {
	plugins: [
		new webpack.EnvironmentPlugin({
			ENVIRONMENT: undefined
		}),
		new webpack.NormalModuleReplacementPlugin(environmentPath, function (resource) {
			var env = process.env.ENVIRONMENT || 'dev'
 			resource.request = resource.request.replace(environmentPath, '/environment/' + env.charAt(0).toUpperCase() + env.substring(1) + 'Environment');
		})
	]
})