chore(bundle): add version info to window.Ionic

Author: adamdbradley

src/dev-server/injector.ts

@@ -1,4 +1,4 @@
-import { getAppScriptsVersion, getSystemInfo } from '../util/helpers';
+import { getAppScriptsVersion, getSystemText } from '../util/helpers';
 import { LOGGER_DIR } from './serve-config';
 
 
@@ -32,7 +32,7 @@ function getDevLoggerScript(rootDir: string, notifyOnConsoleLog: boolean, notifi
     sendConsoleLogs: notifyOnConsoleLog,
     wsPort: notificationPort,
     appScriptsVersion: appScriptsVersion,
-    systemInfo: getSystemInfo(rootDir)
+    systemInfo: getSystemText(rootDir)
   });
 
   return `

src/postprocess.ts

@@ -1,7 +1,9 @@
 import { Logger } from './logger/logger';
+import { getSystemData, readFileAsync, writeFileAsync } from './util/helpers';
 import { BuildContext } from './util/interfaces';
 import { purgeSourceMapsIfNeeded } from './util/source-maps';
 import { removeUnusedFonts } from './optimization/remove-unused-fonts';
+import * as path from 'path';
 
 
 export function postprocess(context: BuildContext) {
@@ -17,7 +19,46 @@ export function postprocess(context: BuildContext) {
 
 function postprocessWorker(context: BuildContext) {
   return Promise.all([
+    addIonicGlobal(context),
     purgeSourceMapsIfNeeded(context),
     removeUnusedFonts(context)
   ]);
 }
+
+
+function addIonicGlobal(context: BuildContext) {
+  const outputFilePath = path.join(context.buildDir, context.outputJsFileName);
+
+  return readFileAsync(outputFilePath).then(outputContent => {
+    const ionicGlobal = buildIonicGlobal(context);
+
+    if (outputContent.indexOf(ionicGlobal) === -1) {
+      outputContent += ionicGlobal;
+      return writeFileAsync(outputFilePath, outputContent);
+    }
+  });
+}
+
+
+function buildIonicGlobal(context: BuildContext) {
+  if ((<any>context).windowIonic) {
+    // just a quick way to cache this to avoid unnecessary readFiles
+    return (<any>context).windowIonic;
+  }
+
+  const systemData = getSystemData(context.rootDir);
+
+  let output = `
+    (function(w){
+      var i = w.Ionic = w.Ionic || {};
+      ${systemData.ionicFramework ? `i.version = '${systemData.ionicFramework}';` : ''}
+      ${systemData.angularCore ? `i.angular = '${systemData.angularCore}';` : ''}
+      ${systemData.ionicNative ? `i.ionicNative = '${systemData.ionicNative}';` : ''}
+    })(window);`;
+
+  // real quick minification hack
+  output = output.replace(/\s/g, '');
+  output = output.replace('vari=', 'var i=');
+
+  return (<any>context).windowIonic = `\n\n${output}`;
+}

src/util/config.ts

@@ -175,13 +175,13 @@ export function generateContext(context?: BuildContext): BuildContext {
   setProcessEnvVar(Constants.ENV_CLOSURE_JAR, closureCompilerJarPath);
   Logger.debug(`closureCompilerJarPath set to ${closureCompilerJarPath}`);
 
-  const outputJsFileName = getConfigValue(context, '--outputJsFileName', null, Constants.ENV_OUTPUT_JS_FILE_NAME, Constants.ENV_OUTPUT_JS_FILE_NAME.toLowerCase(), 'main.js');
-  setProcessEnvVar(Constants.ENV_OUTPUT_JS_FILE_NAME, outputJsFileName);
-  Logger.debug(`outputJsFileName set to ${outputJsFileName}`);
+  context.outputJsFileName = getConfigValue(context, '--outputJsFileName', null, Constants.ENV_OUTPUT_JS_FILE_NAME, Constants.ENV_OUTPUT_JS_FILE_NAME.toLowerCase(), 'main.js');
+  setProcessEnvVar(Constants.ENV_OUTPUT_JS_FILE_NAME, context.outputJsFileName);
+  Logger.debug(`outputJsFileName set to ${context.outputJsFileName}`);
 
-  const outputCssFileName = getConfigValue(context, '--outputCssFileName', null, Constants.ENV_OUTPUT_CSS_FILE_NAME, Constants.ENV_OUTPUT_CSS_FILE_NAME.toLowerCase(), 'main.css');
-  setProcessEnvVar(Constants.ENV_OUTPUT_CSS_FILE_NAME, outputCssFileName);
-  Logger.debug(`outputCssFileName set to ${outputCssFileName}`);
+  context.outputCssFileName = getConfigValue(context, '--outputCssFileName', null, Constants.ENV_OUTPUT_CSS_FILE_NAME, Constants.ENV_OUTPUT_CSS_FILE_NAME.toLowerCase(), 'main.css');
+  setProcessEnvVar(Constants.ENV_OUTPUT_CSS_FILE_NAME, context.outputCssFileName);
+  Logger.debug(`outputCssFileName set to ${context.outputCssFileName}`);
 
   const webpackFactoryPath = join(getProcessEnvVar(Constants.ENV_VAR_APP_SCRIPTS_DIR), 'dist', 'webpack', 'ionic-webpack-factory.js');
   setProcessEnvVar(Constants.ENV_WEBPACK_FACTORY, webpackFactoryPath);

src/util/helpers.ts

@@ -24,7 +24,7 @@ export function getAppScriptsPackageJson() {
   return cachedAppScriptsPackageJson;
 }
 
-export function getAppScriptsVersion() {
+export function getAppScriptsVersion(): string {
   const appScriptsPackageJson = getAppScriptsPackageJson();
   return (appScriptsPackageJson && appScriptsPackageJson.version) ? appScriptsPackageJson.version : '';
 }
@@ -36,38 +36,48 @@ function getUserPackageJson(userRootDir: string) {
   return null;
 }
 
-export function getSystemInfo(userRootDir: string) {
+export function getSystemText(userRootDir: string) {
+  const systemData = getSystemData(userRootDir);
   const d: string[] = [];
 
-  let ionicAppScripts = getAppScriptsVersion();
-  let ionicFramework: string = null;
-  let ionicNative: string = null;
-  let angularCore: string = null;
-  let angularCompilerCli: string = null;
+  d.push(`Ionic Framework: ${systemData.ionicFramework}`);
+  if (systemData.ionicNative) {
+    d.push(`Ionic Native: ${systemData.ionicNative}`);
+  }
+  d.push(`Ionic App Scripts: ${systemData.ionicAppScripts}`);
+  d.push(`Angular Core: ${systemData.angularCore}`);
+  d.push(`Angular Compiler CLI: ${systemData.angularCompilerCli}`);
+  d.push(`Node: ${systemData.node}`);
+  d.push(`OS Platform: ${systemData.osName}`);
+
+  return d;
+}
+
+
+export function getSystemData(userRootDir: string) {
+  const d = {
+    ionicAppScripts: getAppScriptsVersion(),
+    ionicFramework: '',
+    ionicNative: '',
+    angularCore: '',
+    angularCompilerCli: '',
+    node: process.version.replace('v', ''),
+    osName: osName()
+  };
 
   try {
     const userPackageJson = getUserPackageJson(userRootDir);
     if (userPackageJson) {
       const userDependencies = userPackageJson.dependencies;
       if (userDependencies) {
-        ionicFramework = userDependencies['ionic-angular'];
-        ionicNative = userDependencies['ionic-native'];
-        angularCore = userDependencies['@angular/core'];
-        angularCompilerCli = userDependencies['@angular/compiler-cli'];
+        d.ionicFramework = userDependencies['ionic-angular'];
+        d.ionicNative = userDependencies['ionic-native'];
+        d.angularCore = userDependencies['@angular/core'];
+        d.angularCompilerCli = userDependencies['@angular/compiler-cli'];
       }
     }
   } catch (e) {}
 
-  d.push(`Ionic Framework: ${ionicFramework}`);
-  if (ionicNative) {
-    d.push(`Ionic Native: ${ionicNative}`);
-  }
-  d.push(`Ionic App Scripts: ${ionicAppScripts}`);
-  d.push(`Angular Core: ${angularCore}`);
-  d.push(`Angular Compiler CLI: ${angularCompilerCli}`);
-  d.push(`Node: ${process.version.replace('v', '')}`);
-  d.push(`OS Platform: ${osName()}`);
-
   return d;
 }
 
@@ -135,7 +145,7 @@ export function readAndCacheFile(filePath: string, purge: boolean = false): Prom
   });
 }
 
-export function unlinkAsync(filePath: string|string[]) {
+export function unlinkAsync(filePath: string|string[]): Promise<any> {
   let filePaths: string[];
 
   if (typeof filePath === 'string') {

src/util/interfaces.ts

@@ -17,6 +17,8 @@ export interface BuildContext {
   wwwDir?: string;
   wwwIndex?: string;
   buildDir?: string;
+  outputJsFileName?: string;
+  outputCssFileName?: string;
   nodeModulesDir?: string;
   ionicAngularDir?: string;
   moduleFiles?: string[];