diff --git a/tools/gulp/tasks/aot.ts b/tools/gulp/tasks/aot.ts
index 379986f4933..6c78972722f 100644
--- a/tools/gulp/tasks/aot.ts
+++ b/tools/gulp/tasks/aot.ts
@@ -4,11 +4,14 @@ import {execNodeTask} from '../util/task_helpers';
 import {join} from 'path';
 import {buildConfig, sequenceTask} from 'material2-build-tools';
 
-const {outputDir} = buildConfig;
+const {outputDir, packagesDir} = buildConfig;
 
 /** Path to the directory where all releases are living. */
 const releasesDir = join(outputDir, 'releases');
 
+/** Path to the demo-app source directory. */
+const demoAppSource = join(packagesDir, 'demo-app');
+
 /** Path to the demo-app output directory. */
 const demoAppOut = join(outputDir, 'packages', 'demo-app');
 
@@ -17,9 +20,8 @@ const tsconfigFile = join(demoAppOut, 'tsconfig-aot.json');
 
 /** Builds the demo-app and material. To be able to run NGC, apply the metadata workaround. */
 task('aot:deps', sequenceTask(
-  'build:devapp',
   ['material:build-release', 'cdk:build-release', 'material-moment-adapter:build-release'],
-  'aot:copy-release'
+  [':build:devapp:assets', ':build:devapp:scss', 'aot:copy-devapp', 'aot:copy-release'],
 ));
 
 // As a workaround for https://github.com/angular/angular/issues/12249, we need to
@@ -31,6 +33,10 @@ task('aot:copy-release', () => {
       join(releasesDir, 'material-moment-adapter'), join(demoAppOut, 'material-moment-adapter'));
 });
 
+// // As a workaround for https://github.com/angular/angular/issues/12249, we need to
+// copy the demo-app sources to distribution and run the NGC inside of the dist folder.
+task('aot:copy-devapp', () => copySync(demoAppSource, demoAppOut));
+
 /** Build the demo-app and a release to confirm that the library is AOT-compatible. */
 task('aot:build', sequenceTask('clean', 'aot:deps', 'aot:compiler-cli'));
 
diff --git a/tools/gulp/tasks/development.ts b/tools/gulp/tasks/development.ts
index 1774098b409..8380e70edbc 100644
--- a/tools/gulp/tasks/development.ts
+++ b/tools/gulp/tasks/development.ts
@@ -25,6 +25,9 @@ const appVendors = [
 /** Glob that matches all required vendors for the demo-app. */
 const vendorGlob = `+(${appVendors.join('|')})/**/*.+(html|css|js|map)`;
 
+/** Glob that matches all assets that need to be copied to the output. */
+const assetsGlob = join(appDir, `**/*.+(html|css)`);
+
 task(':watch:devapp', () => {
   watchFiles(join(appDir, '**/*.ts'), [':build:devapp:ts']);
   watchFiles(join(appDir, '**/*.scss'), [':build:devapp:scss']);
@@ -44,7 +47,8 @@ const tsconfigPath = join(appDir, 'tsconfig-build.json');
 
 task(':build:devapp:ts', tsBuildTask(tsconfigPath));
 task(':build:devapp:scss', buildScssTask(outDir, appDir));
-task(':build:devapp:assets', copyTask(appDir, outDir));
+task(':build:devapp:assets', copyTask(assetsGlob, outDir));
+
 task(':serve:devapp', serverTask(outDir, true));
 
 // The themes for the demo-app are built by using the SCSS mixins from Material.