feat(@angular/cli): inline style and templates in defaults

docs/documentation/new.md

@@ -34,7 +34,20 @@ Default applications are created in a directory of the same name, with an initia
     <code>--inline-style</code> (alias: <code>-is</code>) <em>default value: false</em>
   </p>
   <p>
-    Should have an inline style.
+    Determine whether the generated AppComponent styles will be inlined in the component code, or a seperate styles file.
+  </p>
+</details>
+
+<details>
+  <summary>inline-style-all</summary>
+  <p>
+    <code>--inline-style-all</code> (alias: <code>-isa</code>) <em>default value: false</em>
+  </p>
+  <p>
+    Determine whether all generated components' styles will be inlined in the component code, or a seperate styles file.
+  </p>
+  <p>
+    You can later change the value in <em>.angular-cli.json</em> (<code>defaults.component.inlineStyle</code>).
   </p>
 </details>
 
@@ -44,7 +57,20 @@ Default applications are created in a directory of the same name, with an initia
     <code>--inline-template</code> (alias: <code>-it</code>) <em>default value: false</em>
   </p>
   <p>
-    Should have an inline template.
+    Determine whether the generated AppComponent template will be inlined in the component code, or a seperate template file.
+  </p>
+</details>
+
+<details>
+  <summary>inline-template-all</summary>
+  <p>
+    <code>--inline-template-all</code> (alias: <code>-ita</code>) <em>default value: false</em>
+  </p>
+  <p>
+    Determine whether all generated components' templates will be inlined in the component code, or a seperate template file.
+  </p>
+  <p>
+    You can later change the value in <em>.angular-cli.json</em> (<code>defaults.component.inlineTemplate</code>).
   </p>
 </details>
 

packages/@angular/cli/blueprints/ng/files/__path__/app/app.component.ts

@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
   selector: '<%= prefix %>-root',<% if (inlineTemplate) { %>
   template: `
     <h1>
-      {{title}}
+      Welcome to {{title}}!!
     </h1><% if (routing) { %>
     <router-outlet></router-outlet><% } %>
   `,<% } else { %>

packages/@angular/cli/blueprints/ng/files/angular-cli.json

@@ -52,7 +52,10 @@
   },
   "defaults": {
     "styleExt": "<%= styleExt %>",<% if (!minimal) { %>
-    "component": {}<% } else { %>
+    "component": {
+      "inlineStyle": <%= inlineStyleAll %>,
+      "inlineTemplate": <%= inlineTemplateAll %>
+    }<% } else { %>
     "component": {
       "spec": false,
       "inlineStyle": true,

packages/@angular/cli/blueprints/ng/index.ts

@@ -1,7 +1,7 @@
-import {CliConfig} from '../../models/config';
+import { CliConfig } from '../../models/config';
 
-const Blueprint   = require('../../ember-cli/lib/models/blueprint');
-const path        = require('path');
+const Blueprint = require('../../ember-cli/lib/models/blueprint');
+const path = require('path');
 const stringUtils = require('ember-cli-string-utils');
 const getFiles = Blueprint.prototype.files;
 
@@ -15,25 +15,23 @@ export default Blueprint.extend({
     { name: 'routing', type: Boolean, default: false },
     { name: 'inline-style', type: Boolean, default: false, aliases: ['is'] },
     { name: 'inline-template', type: Boolean, default: false, aliases: ['it'] },
+    { name: 'inline-style-all', type: Boolean, default: false, aliases: ['isa'] },
+    { name: 'inline-template-all', type: Boolean, default: false, aliases: ['ita'] },
     { name: 'skip-git', type: Boolean, default: false, aliases: ['sg'] },
-    { name: 'minimal',
-      type: Boolean,
-      default: false,
-      description: 'Should create a minimal app.'
-     }
+    { name: 'minimal', type: Boolean, default: false }
   ],
 
-  beforeInstall: function(options: any) {
+  beforeInstall: function (options: any) {
     if (options.ignoredUpdateFiles && options.ignoredUpdateFiles.length > 0) {
       return Blueprint.ignoredUpdateFiles =
         Blueprint.ignoredUpdateFiles.concat(options.ignoredUpdateFiles);
     }
   },
 
-  locals: function(options: any) {
+  locals: function (options: any) {
     if (options.minimal) {
-      options.inlineStyle = true;
-      options.inlineTemplate = true;
+      options.inlineStyleAll = true;
+      options.inlineTemplateAll = true;
       options.skipTests = true;
     }
 
@@ -63,39 +61,38 @@ export default Blueprint.extend({
       styleExt: this.styleExt,
       relativeRootPath: relativeRootPath,
       routing: options.routing,
-      inlineStyle: options.inlineStyle,
-      inlineTemplate: options.inlineTemplate,
+      inlineStyle: options.inlineStyle || options.inlineStyleAll,
+      inlineTemplate: options.inlineTemplate || options.inlineTemplateAll,
+      inlineStyleAll: options.inlineStyleAll,
+      inlineTemplateAll: options.inlineTemplateAll,
       tests: this.tests,
       minimal: options.minimal
     };
   },
 
-  files: function() {
+  files: function () {
     let fileList = getFiles.call(this) as Array<string>;
 
-    if (this.options && !this.options.routing) {
-      fileList = fileList.filter(p => p.indexOf('app-routing.module.ts') < 0);
-    }
-    if (this.options && this.options.inlineTemplate) {
-      fileList = fileList.filter(p => p.indexOf('app.component.html') < 0);
-    }
-    if (this.options && this.options.inlineStyle) {
-      fileList = fileList.filter(p => p.indexOf('app.component.__styleext__') < 0);
-    }
-    if (this.options && this.options.skipGit) {
-      fileList = fileList.filter(p => p.indexOf('gitignore') < 0);
-    }
-
-    if (this.options && this.options.skipTests) {
-      fileList = fileList.filter(p => p.indexOf('app.component.spec.ts') < 0);
-    }
-
-    if (this.options && this.options.minimal) {
-      const toRemoveList: RegExp[] = [/e2e\//, /editorconfig/, /README/, /karma.conf.js/,
-        /protractor.conf.js/, /test.ts/, /tsconfig.spec.json/, /tslint.json/, /favicon.ico/];
-      fileList = fileList.filter(p => {
-        return !toRemoveList.some(re => re.test(p));
+    if (this.options) {
+      const inlineTemplate = this.options.inlineTemplate || this.options.inlineTemplateAll;
+      const inlineStyle = this.options.inlineStyle || this.options.inlineStyleAll;
+      const fileFilters: { filter: boolean, fileName: string }[] = [
+        { filter: !this.options.routing, fileName: 'app-routing.module.ts' },
+        { filter: inlineTemplate , fileName: 'app.component.html' },
+        { filter: inlineStyle, fileName: 'app.component.__styleext__' },
+        { filter: this.options.skipGit, fileName: 'gitignore' },
+        { filter: this.options.skipTests, fileName: 'app.component.spec.ts' }
+      ];
+
+      fileFilters.filter(f => f.filter).forEach(({fileName}) => {
+          fileList = fileList.filter(p => p.indexOf(fileName) < 0);
       });
+
+      if (this.options.minimal) {
+        const toRemoveList: RegExp[] = [/e2e\//, /editorconfig/, /README/, /karma.conf.js/,
+          /protractor.conf.js/, /test.ts/, /tsconfig.spec.json/, /tslint.json/, /favicon.ico/];
+        fileList = fileList.filter(p => !toRemoveList.some(re => re.test(p)));
+      }
     }
 
     const cliConfig = CliConfig.fromProject();

packages/@angular/cli/commands/init.ts

@@ -21,6 +21,8 @@ const InitCommand: any = Command.extend({
     { name: 'routing', type: Boolean, default: false },
     { name: 'inline-style', type: Boolean, default: false, aliases: ['is'] },
     { name: 'inline-template', type: Boolean, default: false, aliases: ['it'] },
+    { name: 'inline-style-all', type: Boolean, default: false, aliases: ['isa'] },
+    { name: 'inline-template-all', type: Boolean, default: false, aliases: ['ita'] },
     {
       name: 'minimal',
       type: Boolean,

packages/@angular/cli/commands/new.ts

@@ -119,21 +119,49 @@ const NewCommand = Command.extend({
       type: Boolean,
       default: false,
       aliases: ['is'],
-      description: 'Should have an inline style.'
+      description: oneLine`
+        Determine whether the generated AppComponent styles will be
+        inlined in the component code, or a seperate styles file.
+      `
+    },
+    {
+      name: 'inline-style-all',
+      type: Boolean,
+      default: false,
+      aliases: ['isa'],
+      description: oneLine`
+        Determine whether all generated components' styles will be
+        inlined in the component code, or a seperate styles file.
+        ${changeLater('defaults.component.inlineStyle')}.
+      `
     },
     {
       name: 'inline-template',
       type: Boolean,
       default: false,
       aliases: ['it'],
-      description: 'Should have an inline template.'
-     },
-     {
+      description: oneLine`
+        Determine whether the generated AppComponent template will be
+        inlined in the component code, or a seperate template file.
+      `
+    },
+    {
+      name: 'inline-template-all',
+      type: Boolean,
+      default: false,
+      aliases: ['ita'],
+      description: oneLine`
+        Determine whether all generated components' templates will be
+        inlined in the component code, or a seperate template file.
+        ${changeLater('defaults.component.inlineTemplate')}.
+      `
+    },
+    {
       name: 'minimal',
       type: Boolean,
       default: false,
       description: 'Should create a minimal app.'
-     }
+    }
   ],
 
   isProject: function (projectPath: string) {

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

@@ -76,6 +76,8 @@ export default Task.extend({
       routing: commandOptions.routing,
       inlineStyle: commandOptions.inlineStyle,
       inlineTemplate: commandOptions.inlineTemplate,
+      inlineStyleAll: commandOptions.inlineStyleAll,
+      inlineTemplateAll: commandOptions.inlineTemplateAll,
       minimal: commandOptions.minimal,
       ignoredUpdateFiles: ['favicon.ico'],
       skipGit: commandOptions.skipGit,