From 297776af7f475c3fa9f921754521d8a40330324a Mon Sep 17 00:00:00 2001
From: Filipe Silva <filipematossilva@gmail.com>
Date: Mon, 21 May 2018 16:55:23 +0100
Subject: [PATCH] feat(@angular/cli): add eject command

---
 docs/documentation/eject.md             | 13 ++++++-
 packages/@angular/cli/commands/eject.ts | 52 ++++++++++++++++++-------
 packages/@angular/cli/lib/cli/index.ts  |  4 +-
 tests/e2e/tests/misc/eject.ts           | 19 +++++++++
 4 files changed, 69 insertions(+), 19 deletions(-)
 create mode 100644 tests/e2e/tests/misc/eject.ts

diff --git a/docs/documentation/eject.md b/docs/documentation/eject.md
index 3e2ff0055fe4..1f40bad9ceb0 100644
--- a/docs/documentation/eject.md
+++ b/docs/documentation/eject.md
@@ -3,7 +3,18 @@
 # ng eject
 
 ## Overview
-Temporarily disabled. Ejects your app and output the proper webpack configuration and scripts.
+Create a basic Webpack configuration for your app.
+
+This command will create a basic webpack configuration and update your `angular.json` file to use it.
+
+This configuration will include the necessary plugins and loader to build Angular applications.
+You may need to edit this configuration to match more advanced build options that your project was using.
+
+You can then build using this configuration via `ng run project-name:build-webpack`.
+
+To build for production use `ng run project-name:build-webpack:production` instead.
+
+To serve using Webpack Dev Server, use `ng run project-name:serve-webpack`.
 
 ## Options
 None.
diff --git a/packages/@angular/cli/commands/eject.ts b/packages/@angular/cli/commands/eject.ts
index fc0e21cc5ebd..2d7f9d2c8ff8 100644
--- a/packages/@angular/cli/commands/eject.ts
+++ b/packages/@angular/cli/commands/eject.ts
@@ -1,22 +1,44 @@
-import { tags } from '@angular-devkit/core';
-import { Command, Option } from '../models/command';
+import { CommandScope, Option } from '../models/command';
+import { CoreSchematicOptions, SchematicCommand } from '../models/schematic-command';
 
 
-export default class EjectCommand extends Command {
+export interface EjectOptions extends CoreSchematicOptions { }
+
+export default class EjectCommand extends SchematicCommand {
   public readonly name = 'eject';
-  public readonly description = 'Temporarily disabled. Ejects your app and output the proper '
-                              + 'webpack configuration and scripts.';
-  public readonly arguments: string[] = [];
-  public readonly options: Option[] = [];
+  public readonly description = 'Create a basic Webpack configuration for your app.';
+  public static aliases: string[] = [];
+  public readonly scope = CommandScope.everywhere;
+  public arguments: string[] = [];
+  public options: Option[] = [];
+
+  private collectionName = '@schematics/angular';
+  private schematicName = 'update';
 
-  run() {
-    this.logger.info(tags.stripIndents`
-      The 'eject' command has been temporarily disabled, as it is not yet compatible with the new
-      angular.json format. The new configuration format provides further flexibility to modify the
-      configuration of your workspace without ejecting. Ejection will be re-enabled in a future
-      release of the CLI.
+  private initialized = false;
+  public async initialize(options: any) {
+    if (this.initialized) {
+      return;
+    }
+    super.initialize(options);
+    this.initialized = true;
+
+    const schematicOptions = await this.getOptions({
+      schematicName: this.schematicName,
+      collectionName: this.collectionName,
+    });
+    this.options = this.options.concat(schematicOptions.options);
+    this.arguments = this.arguments.concat(schematicOptions.arguments.map(a => a.name));
+  }
 
-      If you need to eject today, use CLI 1.7 to eject your project.
-    `);
+  public async run(options: EjectOptions) {
+    return this.runSchematic({
+      collectionName: this.collectionName,
+      schematicName: this.schematicName,
+      schematicOptions: options,
+      dryRun: options.dryRun,
+      force: false,
+      showNothingDone: false,
+    });
   }
 }
diff --git a/packages/@angular/cli/lib/cli/index.ts b/packages/@angular/cli/lib/cli/index.ts
index 3035a2217b34..d230ba1bbd12 100644
--- a/packages/@angular/cli/lib/cli/index.ts
+++ b/packages/@angular/cli/lib/cli/index.ts
@@ -11,6 +11,7 @@ function loadCommands() {
     'new': require('../../commands/new').default,
     'generate': require('../../commands/generate').default,
     'update': require('../../commands/update').default,
+    'eject': require('../../commands/eject').default,
 
     // Architect commands.
     'build': require('../../commands/build').default,
@@ -21,9 +22,6 @@ function loadCommands() {
     'xi18n': require('../../commands/xi18n').default,
     'run': require('../../commands/run').default,
 
-    // Disabled commands.
-    'eject': require('../../commands/eject').default,
-
     // Easter eggs.
     'make-this-awesome': require('../../commands/easter-egg').default,
 
diff --git a/tests/e2e/tests/misc/eject.ts b/tests/e2e/tests/misc/eject.ts
new file mode 100644
index 000000000000..ffc621b5b4e6
--- /dev/null
+++ b/tests/e2e/tests/misc/eject.ts
@@ -0,0 +1,19 @@
+import { expectFileToMatch } from '../../utils/fs';
+import { ng, execAndWaitForOutputToMatch, killAllProcesses } from '../../utils/process';
+
+export default function () {
+  return ng('eject')
+    .then(() => expectFileToMatch('angular.json', /\"build-webpack\":/))
+    .then(() => expectFileToMatch('angular.json', /\"serve-webpack\":/))
+    .then(() => ng('run', 'test-project:build-webpack'))
+    .then(() => ng('run', 'test-project:build-webpack:production'))
+    // Use the default e2e with no devServerTarget.
+    .then(() => execAndWaitForOutputToMatch('ng', ['run', 'test-project:serve-webpack'],
+      /: Compiled successfully./))
+    .then(() => ng('e2e', 'test-project-e2e', '--devServerTarget=',
+      '--baseUrl=http://localhost:8080'))
+    .then(() => killAllProcesses(), (err: any) => {
+      killAllProcesses();
+      throw err;
+    });
+}