build: upgrade material to latest version of angular-cli (#293)

And remove the unnecessary parts.

angular-cli-build.js

@@ -0,0 +1,36 @@
+'use strict';
+const fs = require('fs');
+const path = require('path');
+
+// Import the require hook. Enables us to require TS files natively.
+require('ts-node/register');
+
+
+const Angular2App = require('angular-cli/lib/broccoli/angular2-app');
+const Funnel = require('broccoli-funnel');
+const MergeTree = require('broccoli-merge-trees');
+const autoPrefixerTree = require('broccoli-autoprefixer');
+
+
+module.exports = function(defaults) {
+  var angularAppTree = new Angular2App(defaults, {
+    sourceDir: 'src/',
+    sassCompiler: {
+      includePaths: [
+        'src/core/style'
+      ]
+    },
+    vendorNpmFiles: []
+  });
+
+  const ngTree = angularAppTree.toTree();
+  const cssAutoprefixed = autoPrefixerTree(new Funnel(ngTree, {
+    include: [ '**/*.css' ]
+  }));
+
+  return new MergeTree([
+    new Funnel('src', { include: ['**/*.scss']}),
+    angularAppTree.toTree(),
+    cssAutoprefixed
+  ], { overwrite: true });
+};

e2e/tsconfig.json

@@ -3,6 +3,7 @@
     "declaration": true,
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
+    "inlineSources": true,
     "mapRoot": "",
     "module": "commonjs",
     "moduleResolution": "node",
@@ -11,10 +12,10 @@
     "outDir": "../dist/e2e/",
     "rootDir": ".",
     "sourceMap": true,
-    "sourceRoot": "/",
     "target": "es5"
   },
   "files": [
+    "index.e2e.ts",
     "e2e.d.ts"
   ]
 }

ember-cli-build.js

@@ -1,55 +0,0 @@
-'use strict';
-const fs = require('fs');
-const path = require('path');
-
-// Import the require hook. Enables us to require TS files natively.
-require('ts-node/register');
-
-const mergeTrees = require('broccoli-merge-trees');
-const BroccoliFunnel = require('broccoli-funnel');
-const Angular2App = require('angular-cli/lib/broccoli/angular2-app');
-const BroccoliSass = require('broccoli-sass');
-const broccoliAutoprefixer = require('broccoli-autoprefixer');
-const autoprefixerOptions = require('./build/autoprefixer-options');
-
-
-module.exports = function(defaults) {
-  var demoAppCssTree = new BroccoliSass(['src/demo-app'], './demo-app.scss', 'demo-app/demo-app.css');
-  var demoCssTree = getCssTree('demo-app');
-  var componentCssTree = getCssTree('components');
-  var mainCssTree = new BroccoliSass(['src', 'src/core/style'], './main.scss', 'main.css');
-  var angularAppTree = new Angular2App(defaults, {
-    vendorNpmFiles: []
-  });
-
-  return mergeTrees([
-    angularAppTree.toTree(),
-    componentCssTree,
-    mainCssTree,
-    demoAppCssTree,
-    demoCssTree
-  ]);
-};
-
-/** Gets the tree for all of the components' CSS. */
-function getCssTree(folder) {
-  var srcPath = `src/${folder}/`;
-  var components = fs.readdirSync(srcPath)
-    .filter(file => fs.statSync(path.join(srcPath, file)).isDirectory());
-
-  var componentCssTrees = components.reduce((trees, component) => {
-    // We want each individual scss file to be compiled into a corresponding css file
-    // so that they can be individually included in styleUrls.
-    var scssFiles = fs.readdirSync(path.join(srcPath, component))
-        .filter(file => path.extname(file) === '.scss')
-        .map(file => path.basename(file, '.scss'));
-
-    return scssFiles.map(fileName => {
-      return BroccoliSass(
-          [`${srcPath}/${component}`, 'src/core/style'], // Directories w/ scss sources
-          `./${fileName}.scss`,                              // Root scss input file
-          `${folder}/${component}/${fileName}.css`);        // Css output file
-    }).concat(trees);
-  }, []);
-  return broccoliAutoprefixer(mergeTrees(componentCssTrees), autoprefixerOptions);
-}

package.json

@@ -35,14 +35,9 @@
   },
   "devDependencies": {
     "add-stream": "^1.0.0",
-    "angular-cli": "^0.0.28",
-    "angular-cli-github-pages": "^0.2.0",
+    "angular-cli": "^0.0.31",
     "broccoli-autoprefixer": "^4.1.0",
-    "broccoli-caching-writer": "^2.2.1",
     "broccoli-funnel": "^1.0.1",
-    "broccoli-merge-trees": "^1.1.1",
-    "broccoli-sass": "^0.7.0",
-    "broccoli-source": "^1.1.0",
     "browserstacktunnel-wrapper": "^1.4.2",
     "conventional-changelog": "^1.1.0",
     "ember-cli-inject-live-reload": "^1.3.0",
@@ -59,7 +54,9 @@
     "karma-firefox-launcher": "^0.1.7",
     "karma-jasmine": "^0.3.6",
     "karma-sauce-launcher": "^0.2.14",
+    "node-sass": "^3.4.2",
     "protractor": "^3.1.1",
+    "sass": "^0.5.0",
     "strip-ansi": "^3.0.0",
     "symlink-or-copy": "^1.0.1",
     "ts-node": "^0.5.5",

src/core/style/_elevation.scss

@@ -1,3 +1,5 @@
+@import "variables";
+
 /**
  * A collection of mixins and CSS classes that can be used to apply elevation to a material
  * element.