docs: systemjs.config.plunker -> systemjs.config.web w/ auto-bootstrap (#2756)

see PR #2756

Author: wardbell

gulpfile.js

@@ -637,7 +637,7 @@ gulp.task('build-dart-api-docs', ['_shred-api-examples', 'dartdoc'], function()
   return buildApiDocsForDart();
 });
 
-// Using the --build flag will use systemjs.config.plunker.build.js (for preview builds)
+// Using the --build flag will use systemjs.config.web.build.js (for preview builds)
 gulp.task('build-plunkers', ['_copy-example-boilerplate'], function() {
   regularPlunker.buildPlunkers(EXAMPLES_PATH, LIVE_EXAMPLES_PATH, { errFn: gutil.log, build: argv.build });
   return embeddedPlunker.buildPlunkers(EXAMPLES_PATH, LIVE_EXAMPLES_PATH, { errFn: gutil.log, build: argv.build, targetSelf: argv.targetSelf });

public/docs/_examples/_boilerplate/systemjs.config.plunker.build.js renamed to public/docs/_examples/_boilerplate/systemjs.config.web.build.js

@@ -1,5 +1,5 @@
 /**
- * PLUNKER VERSION FOR CURRENT ANGULAR BUILD
+ * WEB VERSION FOR CURRENT ANGULAR BUILD
  * (based on systemjs.config.js in angular.io)
  * System configuration for Angular samples
  * Adjust as necessary for your application needs.
@@ -11,7 +11,19 @@
     // DEMO ONLY! REAL CODE SHOULD NOT TRANSPILE IN THE BROWSER
     transpiler: 'ts',
     typescriptOptions: {
-      tsconfig: true
+      // Complete copy of compiler options in standard tsconfig.json
+      "target": "es5",
+      "module": "commonjs",
+      "moduleResolution": "node",
+      "sourceMap": true,
+      "emitDecoratorMetadata": true,
+      "experimentalDecorators": true,
+      "removeComments": false,
+      "noImplicitAny": true,
+      "suppressImplicitAnyIndexErrors": true,
+      "typeRoots": [
+        "../../node_modules/@types/"
+      ]
     },
     meta: {
       'typescript': {
@@ -67,4 +79,26 @@
       }
     }
   });
+
+  if (!global.noBootstrap) { bootstrap(); }
+
+  // Bootstrap the `AppModule`(skip the `app/main.ts` that normally does this)
+  function bootstrap() {
+
+    // Stub out `app/main.ts` so System.import('app') doesn't fail if called in the index.html
+    System.set(System.normalizeSync('app/main.ts'), System.newModule({ }));
+
+    // bootstrap and launch the app (equivalent to standard main.ts)
+    Promise.all([
+      System.import('@angular/platform-browser-dynamic'),
+      System.import('app/app.module')
+    ])
+    .then(function (imports) {
+      var platform = imports[0];
+      var app      = imports[1];
+      platform.platformBrowserDynamic().bootstrapModule(app.AppModule);
+    })
+    .catch(function(err){ console.error(err); });
+  }
+
 })(this);

public/docs/_examples/_boilerplate/systemjs.config.plunker.js renamed to public/docs/_examples/_boilerplate/systemjs.config.web.js

@@ -1,5 +1,5 @@
 /**
- * PLUNKER VERSION
+ * WEB ANGULAR VERSION
  * (based on systemjs.config.js in angular.io)
  * System configuration for Angular samples
  * Adjust as necessary for your application needs.
@@ -9,7 +9,19 @@
     // DEMO ONLY! REAL CODE SHOULD NOT TRANSPILE IN THE BROWSER
     transpiler: 'ts',
     typescriptOptions: {
-      tsconfig: true
+      // Complete copy of compiler options in standard tsconfig.json
+      "target": "es5",
+      "module": "commonjs",
+      "moduleResolution": "node",
+      "sourceMap": true,
+      "emitDecoratorMetadata": true,
+      "experimentalDecorators": true,
+      "removeComments": false,
+      "noImplicitAny": true,
+      "suppressImplicitAnyIndexErrors": true,
+      "typeRoots": [
+        "../../node_modules/@types/"
+      ]
     },
     meta: {
       'typescript': {
@@ -54,4 +66,26 @@
       }
     }
   });
+
+  if (!global.noBootstrap) { bootstrap(); }
+
+  // Bootstrap the `AppModule`(skip the `app/main.ts` that normally does this)
+  function bootstrap() {
+
+    // Stub out `app/main.ts` so System.import('app') doesn't fail if called in the index.html
+    System.set(System.normalizeSync('app/main.ts'), System.newModule({ }));
+
+    // bootstrap and launch the app (equivalent to standard main.ts)
+    Promise.all([
+      System.import('@angular/platform-browser-dynamic'),
+      System.import('app/app.module')
+    ])
+    .then(function (imports) {
+      var platform = imports[0];
+      var app      = imports[1];
+      platform.platformBrowserDynamic().bootstrapModule(app.AppModule);
+    })
+    .catch(function(err){ console.error(err); });
+  }
+
 })(this);

public/docs/_examples/testing/ts/browser-test-shim.js

@@ -33,6 +33,8 @@ System.config({
   },
 });
 
+document['noBootstrap'] = true; // do not run system.config.web.js bootstrap
+
 System.import('systemjs.config.js')
   .then(importSystemJsExtras)
   .then(initTestBed)

tools/plunker-builder/builder.js

@@ -41,7 +41,6 @@ class PlunkerBuilder {
     if (config.basePath.indexOf('/ts') > -1) {
       // uses systemjs.config.js so add plunker version
       this.options.addField(postData, 'systemjs.config.js', this.systemjsConfig);
-      this.options.addField(postData, 'tsconfig.json', this.tsconfig);
     }
   }
 
@@ -210,13 +209,12 @@ class PlunkerBuilder {
   _getPlunkerFiles() {
     // Assume plunker version is sibling of node_modules version
     this.readme = fs.readFileSync(this.basePath +  '/_boilerplate/plunker.README.md', 'utf-8');
-    var systemJsConfigPath = '/_boilerplate/systemjs.config.plunker.js';
+    var systemJsConfigPath = '/_boilerplate/systemjs.config.web.js';
     if (this.options.build) {
-      systemJsConfigPath = '/_boilerplate/systemjs.config.plunker.build.js';
+      systemJsConfigPath = '/_boilerplate/systemjs.config.web.build.js';
     }
     this.systemjsConfig = fs.readFileSync(this.basePath + systemJsConfigPath, 'utf-8');
     this.systemjsConfig +=  this.copyrights.jsCss;
-    this.tsconfig = fs.readFileSync(`${this.basePath}/_boilerplate/tsconfig.json`, 'utf-8');
   }
 
   _htmlToElement(document, html) {
@@ -255,8 +253,8 @@ class PlunkerBuilder {
       }
     });
 
-    // var defaultExcludes = [ '!**/node_modules/**','!**/tsconfig.json', '!**/*plnkr.json', '!**/*plnkr.html', '!**/*plnkr.no-link.html' ];
     var defaultExcludes = [
+      '!**/app/main.ts',
       '!**/tsconfig.json',
       '!**/*plnkr.*',
       '!**/package.json',