feat(@angular/cli): add ability to build bundle for node and export lazy route map

Author: FrozenPandaz

packages/@angular/cli/lib/config/schema.json

@@ -83,6 +83,12 @@
             "type": "string",
             "description": "Base url for the application being built."
           },
+          "platform": {
+            "type": "string",
+            "enum": ["browser", "server"],
+            "default": "browser",
+            "description": "The runtime platform of the app."
+          },
           "index": {
             "type": "string",
             "default": "index.html",

packages/@angular/cli/models/webpack-config.ts

@@ -7,6 +7,7 @@ import {
   getDevConfig,
   getProdConfig,
   getStylesConfig,
+  getServerConfig,
   getNonAotConfig,
   getAotConfig
 } from './webpack-configs';
@@ -37,9 +38,12 @@ export class NgCliWebpackConfig {
   }
 
   public buildConfig() {
+    const platformConfig = this.wco.appConfig.platform === 'server' ?
+      getServerConfig(this.wco) : getBrowserConfig(this.wco);
+
     let webpackConfigs = [
       getCommonConfig(this.wco),
-      getBrowserConfig(this.wco),
+      platformConfig,
       getStylesConfig(this.wco),
       this.getTargetConfig(this.wco)
     ];

packages/@angular/cli/models/webpack-configs/index.ts

@@ -2,6 +2,7 @@ export * from './browser';
 export * from './common';
 export * from './development';
 export * from './production';
+export * from './server';
 export * from './styles';
 export * from './test';
 export * from './typescript';

packages/@angular/cli/models/webpack-configs/server.ts

@@ -0,0 +1,38 @@
+import { WebpackConfigOptions } from '../webpack-config';
+
+/**
+ * Returns a partial specific to creating a bundle for node
+ * @param _wco Options which are include the build options and app config
+ */
+export const getServerConfig = function (_wco: WebpackConfigOptions) {
+  return {
+    target: 'node',
+    output: {
+      libraryTarget: 'commonjs'
+    },
+    externals: [
+      /^@angular/,
+      function (_: any, request: any, callback: (error?: any, result?: any) => void) {
+        // Absolute & Relative paths are not externals
+        if (request.match(/^\.{0,2}\//)) {
+          return callback();
+        }
+
+        try {
+          // Attempt to resolve the module via Node
+          const e = require.resolve(request);
+          if (/node_modules/.test(e)) {
+            // It's a node_module
+            callback(null, request);
+          } else {
+            // It's a system thing (.ie util, fs...)
+            callback();
+          }
+        } catch (e) {
+          // Node couldn't find it, so it must be user-aliased
+          callback();
+        }
+      }
+    ]
+  };
+};

packages/@angular/cli/models/webpack-configs/typescript.ts

@@ -68,6 +68,7 @@ function _createAotPlugin(wco: WebpackConfigOptions, options: any) {
       i18nFile: buildOptions.i18nFile,
       i18nFormat: buildOptions.i18nFormat,
       locale: buildOptions.locale,
+      replaceExport: appConfig.platform === 'server',
       hostReplacementPaths,
       // If we don't explicitely list excludes, it will default to `['**/*.spec.ts']`.
       exclude: []

packages/@angular/cli/tasks/e2e.ts

@@ -4,6 +4,7 @@ import { stripIndents } from 'common-tags';
 import { E2eTaskOptions } from '../commands/e2e';
 import { CliConfig } from '../models/config';
 import { requireProjectModule } from '../utilities/require-project-module';
+import { getAppFromConfig } from '../utilities/app-utils';
 
 const Task = require('../ember-cli/lib/models/task');
 const SilentError = require('silent-error');
@@ -14,10 +15,14 @@ export const E2eTask = Task.extend({
     const projectConfig = CliConfig.fromProject().config;
     const projectRoot = this.project.root;
     const protractorLauncher = requireProjectModule(projectRoot, 'protractor/built/launcher');
+    const appConfig = getAppFromConfig(e2eTaskOptions.app);
 
     if (projectConfig.project && projectConfig.project.ejected) {
       throw new SilentError('An ejected project cannot use the build command anymore.');
     }
+    if (appConfig.platform === 'server') {
+      throw new SilentError('ng test for platform server applications is coming soon!');
+    }
 
     return new Promise(function () {
       let promise = Promise.resolve();

packages/@angular/cli/tasks/eject.ts

@@ -436,6 +436,9 @@ export default Task.extend({
     if (project.root === path.resolve(outputPath)) {
       throw new SilentError ('Output path MUST not be project root directory!');
     }
+    if (appConfig.platform === 'server') {
+      throw new SilentError('ng eject for platform server applications is coming soon!');
+    }
 
     const webpackConfig = new NgCliWebpackConfig(runTaskOptions, appConfig).buildConfig();
     const serializer = new JsonWebpackSerializer(process.cwd(), outputPath, appConfig.root);

packages/@angular/cli/tasks/serve.ts

@@ -31,6 +31,9 @@ export default Task.extend({
     if (projectConfig.project && projectConfig.project.ejected) {
       throw new SilentError('An ejected project cannot use the build command anymore.');
     }
+    if (appConfig.platform === 'server') {
+      throw new SilentError('ng serve for platform server applications is coming soon!');
+    }
     if (serveTaskOptions.deleteOutputPath) {
       fs.removeSync(path.resolve(this.project.root, outputPath));
     }

packages/@angular/cli/tasks/test.ts

@@ -3,6 +3,7 @@ import * as path from 'path';
 import { TestOptions } from '../commands/test';
 import { CliConfig } from '../models/config';
 import { requireProjectModule } from '../utilities/require-project-module';
+import { getAppFromConfig } from '../utilities/app-utils';
 
 const Task = require('../ember-cli/lib/models/task');
 const SilentError = require('silent-error');
@@ -12,10 +13,14 @@ export default Task.extend({
   run: function (options: TestOptions) {
     const projectConfig = CliConfig.fromProject().config;
     const projectRoot = this.project.root;
+    const appConfig = getAppFromConfig(options.app);
 
     if (projectConfig.project && projectConfig.project.ejected) {
       throw new SilentError('An ejected project cannot use the build command anymore.');
     }
+    if (appConfig.platform === 'server') {
+      throw new SilentError('ng test for platform server applications is coming soon!');
+    }
 
     return new Promise((resolve) => {
       const karma = requireProjectModule(projectRoot, 'karma');

packages/@ngtools/webpack/src/loader.ts

@@ -435,6 +435,83 @@ function _diagnoseDeps(reasons: ModuleReason[], plugin: AotPlugin, checked: Set<
 }
 
 
+export function _getModuleExports(plugin: AotPlugin,
+                                  refactor: TypeScriptFileRefactor): ts.Identifier[] {
+  const exports = refactor
+    .findAstNodes(refactor.sourceFile, ts.SyntaxKind.ExportDeclaration, true);
+
+  return exports
+    .filter(node => {
+
+      const identifiers = refactor.findAstNodes(node, ts.SyntaxKind.Identifier, false);
+
+      identifiers
+        .filter(node => node.getText() === plugin.entryModule.className);
+
+      return identifiers.length > 0;
+    }) as ts.Identifier[];
+}
+
+
+export function _replaceExport(plugin: AotPlugin, refactor: TypeScriptFileRefactor) {
+  if (!plugin.replaceExport) {
+    return;
+  }
+  _getModuleExports(plugin, refactor)
+    .forEach(node => {
+      const factoryPath = _getNgFactoryPath(plugin, refactor);
+      const factoryClassName = plugin.entryModule.className + 'NgFactory';
+      const exportStatement = `export \{ ${factoryClassName} \} from '${factoryPath}'`;
+      refactor.appendAfter(node, exportStatement);
+    });
+}
+
+
+export function _exportModuleMap(plugin: AotPlugin, refactor: TypeScriptFileRefactor) {
+  if (!plugin.replaceExport) {
+    return;
+  }
+
+  const dirName = path.normalize(path.dirname(refactor.fileName));
+  const classNameAppend = plugin.skipCodeGeneration ? '' : 'NgFactory';
+  const modulePathAppend = plugin.skipCodeGeneration ? '' : '.ngfactory';
+
+  _getModuleExports(plugin, refactor)
+    .forEach(node => {
+      const modules = Object.keys(plugin.discoveredLazyRoutes)
+        .map((loadChildrenString) => {
+          let [lazyRouteKey, moduleName] = loadChildrenString.split('#');
+
+          if (!lazyRouteKey || !moduleName) {
+            throw new Error(`${loadChildrenString} was not a proper loadChildren string`);
+          }
+
+          moduleName += classNameAppend;
+          lazyRouteKey += modulePathAppend;
+          const modulePath = plugin.lazyRoutes[lazyRouteKey];
+
+          return {
+            modulePath,
+            moduleName,
+            loadChildrenString
+          };
+        });
+
+      modules.forEach((module, index) => {
+        const relativePath = path.relative(dirName, module.modulePath).replace(/\\/g, '/');
+        refactor.prependBefore(node, `import * as __lazy_${index}__ from './${relativePath}'`);
+      });
+
+      const jsonContent: string = modules
+        .map((module, index) =>
+          `"${module.loadChildrenString}": __lazy_${index}__.${module.moduleName}`)
+        .join();
+
+      refactor.appendAfter(node, `export const LAZY_MODULE_MAP = {${jsonContent}};`);
+    });
+}
+
+
 // Super simple TS transpiler loader for testing / isolated usage. does not type check!
 export function ngcLoader(this: LoaderContext & { _compilation: any }, source: string | null) {
   const cb = this.async();
@@ -464,11 +541,14 @@ export function ngcLoader(this: LoaderContext & { _compilation: any }, source: s
         if (!plugin.skipCodeGeneration) {
           return Promise.resolve()
             .then(() => _removeDecorators(refactor))
-            .then(() => _refactorBootstrap(plugin, refactor));
+            .then(() => _refactorBootstrap(plugin, refactor))
+            .then(() => _replaceExport(plugin, refactor))
+            .then(() => _exportModuleMap(plugin, refactor));
         } else {
           return Promise.resolve()
             .then(() => _replaceResources(refactor))
-            .then(() => _removeModuleId(refactor));
+            .then(() => _removeModuleId(refactor))
+            .then(() => _exportModuleMap(plugin, refactor));
         }
       })
       .then(() => {