Merge branch 'master' into feature/translate

Author: roman

README.md

@@ -39,26 +39,26 @@ TASKS
 | Task                        | Description                                                            |
 |:----------------------------|:-----------------------------------------------------------------------|
 | `npm run start`             | Prepare and start local dev server                                     |
-| `npm run build:vendors`     | Prepare 3rd party libraries for application                            |
+| `npm run build:vendors`     | Prepare npm dependencies for linking                                   |
 | `npm run server`            | Local dev server                                                       |
 | `npm run server:dashboard`  | Local dev server in dashboard mode                                     |
 | `npm run clean`             | Clean generated folders                                                |
 | `npm run eslint`            | Lint code (single run mode)                                            |
 | `npm run gulp eslint:watch` | ESLint in watch mode                                                   |
 | `npm run t`                 | Run unit testing in single run mode                                    |
+| `npm run test:ci`           | Sequence of eslint, tschk and coverage tasks                           |
 | `npm run tests:w`           | Run unit testing in watch mode                                         |
 | `npm run up`                | Update all dependencies one by one running tests after each            |
 | `npm run tschk`             | Run typescript compile but do not emit files (useful for typechecking) |
 | `npm run tschk:w`           | tschk in watch mode                                                    |
 | `npm run build`             | Build application, but not dependencies                                |
-| `npm run build:vendors`     | Prepare dependencies for linking                                       |
-| `npm run build:all`         | Sequence of build:vendors > build                                      |
+| `npm run build:all`         | Sequence of build:vendors and build tasks                              |
+| `npm run build:release`     | Clean rebuild all                                                      |
 | `npm run coverage`          | Run test coverage with verbose reporing                                |
 | `npm run coverage:debug`    | Run coverage task in debug mode                                        |
 | `npm run p "t1" "t2"`       | Run tasks in parallel                                                  |
 | `npm run stryker`           | Run mutation tests                                                     |
 
-
 DEVELOPMENT TIPS
 ---
 * Do not disable cache in devtools (network tab): this improves speed significantly, use Ctrl + F5 to clean cache.
@@ -101,6 +101,8 @@ RESOURCES
 * [Observable-based virtual scroll implementation in Angular](https://github.com/dinony/od-virtualscroll)
 * [Angular Update Guide](https://angular-update-guide.firebaseapp.com/)
 * [Intrinsic first flexbox grid](https://github.com/argyleink/ragrid)
+* [Fast JiT compiler for Angular testing](https://github.com/Quramy/ngx-zombie-compiler)
+* [A loading spinner for Angular 4](https://github.com/Zak-C/ngx-loading)
 
 KNOWN ISSUES
 ---

gulpfile.ts

@@ -7,6 +7,7 @@ import * as Path from 'path';
 import { Application } from '@types/express';;
 import assert = require('assert');
 const gulp = require('gulp');
+const glob = require('glob');
 const g = require('gulp-load-plugins')();
 const buildPath = Path.join(__dirname, 'build');
 
@@ -56,26 +57,35 @@ gulp.task('server:prestart', done => {
             return done();
         }
         g.util.log(g.util.colors.yellow('Version changed or found changes in dependencies, rebuilding vendor libs'));
-        _.forEach(d, (version, pkname) => {
-            g.util.log(`${pkname} ${g.util.colors.cyan(version)}`);
-        });
-    } else {
-        g.util.log(g.util.colors.yellow('Initial build of vendor libs'));
+        _.forEach(d, (version, pkname) => g.util.log(`${pkname} ${g.util.colors.cyan(version)}`));
     }
-    const proc = spawn('npm', ['run', 'build:vendor-libs'], { stdio: 'inherit' });
-    proc.once('exit', () => {
-        fs.writeFileSync(libsInfoFile, JSON.stringify(currentLibsInfo));
-        done();
+    let p = new Promise((resolve, reject) => {
+        g.util.log(g.util.colors.yellow('Initial build of vendor libs'));
+        const proc = spawn('npm', ['run', 'build:vendor-libs'], { stdio: 'inherit' });
+        proc.on('error', reject);
+        proc.once('exit', () => {
+            fs.writeFileSync(libsInfoFile, JSON.stringify(currentLibsInfo));
+            resolve();
+        });
     });
+    let [style] = glob.sync(`${buildPath}/style*.css`);
+    if (!style) {
+        p = p.then(() => new Promise((resolve, reject) => {
+            g.util.log(g.util.colors.yellow('Initial build of vendor style'));
+            const proc = spawn('npm', ['run', 'build:vendor-style'], { stdio: 'inherit' });
+            proc.on('error', reject);
+            proc.once('exit', resolve);
+        }));
+    }
+    return p;
 });
 
 gulp.task('check:build:prod', () => {
-    const globby = require('globby');
-    return globby(`${buildPath}/app*.js`).then(paths => {
-        if (paths.length === 0) {
-            return Promise.reject('build:prod task did not produce app javascript file.');
-        }
-    });
+    let paths = glob.sync(`${buildPath}/app*.js`);
+    if (paths.length === 0) {
+        return Promise.reject('build:prod task did not produce app javascript file.');
+    }
+    return Promise.resolve();
 });
 
 gulp.task('test:int', () => {
@@ -104,7 +114,7 @@ gulp.task('test:int', () => {
 gulp.task('stryker:source', () => {
     gulp.src('src/**/!(*.ts)', { base: 'src' })
         .pipe(gulp.dest(`${buildPath}/source`));
-    let {compilerOptions} = require('./tsconfig.json');
+    let { compilerOptions } = require('./tsconfig.json');
     Object.assign(compilerOptions, {
         target: 'es6',
         sourceMap: false,

package.json

@@ -15,7 +15,8 @@
     "compile:w": "tsc --watch",
     "tschk": "echo tsc --noEmit ... && tsc --noEmit --noUnusedLocals",
     "tschk:w": "npm run tschk -- --watch",
-    "test": "npm run build:all && npm run eslint && npm run tschk && npm run coverage && npm run stryker",
+    "test": "npm run build:all && npm run test:ci && npm run stryker",
+    "test:ci": "npm run eslint && npm run tschk && npm run coverage",
     "t": "npm run karma -- --single-run",
     "tests": "npm run t",
     "tests:w": "npm run karma",
@@ -31,9 +32,8 @@
     "build:vendors": "npm run build:vendor-libs && npm run build:vendor-style",
     "build:all": "npm run build:vendors && npm run build",
     "build:all:prod": "npm run build:vendor-style:prod && npm run build:prod",
-    "build:dist": "npm run clean && npm run build:all:prod",
-    "~build:release": "npm run build:dist",
-    "test:build:prod": "npm run clean && npm run build:prod && npm run gulp check:build:prod",
+    "build:release": "npm run clean && npm run build:all:prod",
+    "test:build:prod": "npm run build:release && npm run gulp check:build:prod",
     "test:int": "npm run gulp -- test:int",
     "postinstall": "npm run build:vendors",
     "yi": "yarn install --no-lockfile",
@@ -54,38 +54,39 @@
     "npm": ">=3"
   },
   "dependencies": {
-    "@angular/common": "4.1.1",
-    "@angular/compiler": "4.1.1",
-    "@angular/core": "4.1.1",
-    "@angular/forms": "4.1.1",
-    "@angular/http": "4.1.1",
-    "@angular/platform-browser": "4.1.1",
-    "@angular/platform-browser-dynamic": "4.1.1",
-    "@angular/router": "4.1.1",
+    "@angular/common": "4.1.2",
+    "@angular/compiler": "4.1.2",
+    "@angular/core": "4.1.2",
+    "@angular/forms": "4.1.2",
+    "@angular/http": "4.1.2",
+    "@angular/platform-browser": "4.1.2",
+    "@angular/platform-browser-dynamic": "4.1.2",
+    "@angular/router": "4.1.2",
     "@ngx-config/core": "0.2.0-rc.5",
     "@ngx-translate/core": "6.0.1",
     "@ngx-translate/http-loader": "0.0.3",
     "core-js": "2.4.1",
-    "rxjs": "5.3.1",
-    "tslib": "1.7.0",
+    "rxjs": "5.4.0",
+    "tslib": "1.7.1",
     "zone.js": "0.8.10"
   },
   "devDependencies": {
-    "@angular/compiler-cli": "4.1.1",
+    "@angular/compiler-cli": "4.1.2",
     "@angularclass/hmr": "1.2.2",
     "@angularclass/hmr-loader": "3.0.2",
-    "@blueprintjs/core": "1.16.0",
+    "@blueprintjs/core": "1.17.1",
     "@types/express": "4.0.35",
     "@types/jasmine": "2.5.47",
     "@types/karma": "0.13.35",
     "@types/lodash": "4.14.64",
     "@types/node": "7.0.18",
     "@types/webpack": "2.2.15",
     "@types/webpack-env": "1.13.0",
-    "@ultimate/aot-loader": "0.1.15",
+    "@ultimate/aot-loader": "0.1.16",
     "angular-router-loader": "0.6.0",
     "angular2-template-loader": "0.6.2",
-    "autoprefixer": "7.0.0",
+    "asset-inject-html-webpack-plugin": "0.6.2",
+    "autoprefixer": "7.1.0",
     "awesome-typescript-loader": "3.1.3",
     "babel-eslint": "7.2.3",
     "concurrently": "3.4.0",
@@ -96,7 +97,7 @@
     "css-to-string-loader": "0.1.2",
     "ejs-loader": "0.3.0",
     "eslint": "3.19.0",
-    "eslint-plugin-flowtype": "2.32.1",
+    "eslint-plugin-flowtype": "2.33.0",
     "eslint-plugin-import": "2.2.0",
     "eslint-plugin-jasmine": "2.2.0",
     "eslint-plugin-lodash": "2.4.2",
@@ -133,16 +134,16 @@
     "karma-sourcemap-loader": "0.3.7",
     "karma-webpack": "2.0.3",
     "lodash": "4.17.4",
-    "node-sass": "4.5.2",
+    "node-sass": "4.5.3",
     "object-diff": "0.0.4",
-    "postcss": "6.0.0",
-    "postcss-import": "9.1.0",
-    "postcss-loader": "1.3.3",
-    "postcss-url": "6.0.4",
+    "postcss": "6.0.1",
+    "postcss-import": "10.0.0",
+    "postcss-loader": "2.0.5",
+    "postcss-url": "6.1.0",
     "raw-loader": "0.5.1",
     "read-pkg-up": "2.0.0",
     "rimraf": "2.6.1",
-    "sass-loader": "6.0.3",
+    "sass-loader": "6.0.5",
     "stryker": "0.6.1",
     "stryker-api": "0.5.0",
     "stryker-html-reporter": "0.4.1",
@@ -154,7 +155,7 @@
     "typescript-eslint-parser": "2.1.0",
     "updtr": "1.0.0",
     "url-loader": "0.5.8",
-    "webpack": "2.5.0",
+    "webpack": "2.5.1",
     "webpack-dashboard": "0.4.0",
     "webpack-dev-server": "2.4.5",
     "webpack-hot-middleware": "2.18.0"

src/app.scss

@@ -1,7 +1,12 @@
-.grid {
-    display: grid;
+$font-family: 'Segoe UI';
+
+.example {
+    display: flex;
+    transition: all .5s;
+    user-select: none;
+    background: linear-gradient(to bottom, white, black);
 }
 
 body {
-    font-family: 'Segoe UI';
+    font-family: $font-family;
 }

src/app/home/home.component.html

@@ -8,3 +8,5 @@ <h2>Home</h2>
 <input class="pt-input" [(ngModel)]="name">
 
 <p id="name-result">Hello {{name}}</p>
+
+<img [src]="seedImage" alt="Seed image" />

src/app/home/home.component.ts

@@ -7,4 +7,5 @@ import { Component } from '@angular/core';
 })
 export class HomeComponent {
     name = 'Angular';
+    public seedImage = require('../../shared/images/seed.png');
 }

src/index.ejs

@@ -5,13 +5,11 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" type="text/css" href="style.css">
+    <!-- css_inject_point_asset_style -->
     <title>Angular App</title>
 </head>
 <body>
     <app>Loading...</app>
-    <% if (htmlWebpackPlugin.options.config.dev) { %>
-        <script src="libs.js"></script>
-    <% } %>
+    <!-- js_inject_point_asset_libs if_dev -->
 </body>
 </html>

src/shared/images/seed.png

@@ -0,0 +1,9 @@
+import { NgModule } from '@angular/core';
+
+@NgModule({
+    imports: [
+    ],
+    declarations: [
+    ],
+})
+export class SharedModule { }

src/shared/shared.module.ts

@@ -0,0 +1,15 @@
+// Example of custom build from scss source.
+$output-bourbon-deprecation-warnings: false;
+@import "~@blueprintjs/core/src/common/resets";
+// Fix error by resolve-url-loader or sass-resources-loader
+// https://github.com/webpack-contrib/sass-loader#problems-with-url
+// @import "~@blueprintjs/core/src/common/font-imports";
+@import "~@blueprintjs/core/src/common/variables";
+@import "~@blueprintjs/core/src/common/colors";
+@import "~@blueprintjs/core/src/typography";
+@import "~@blueprintjs/core/src/icons";
+@import "~@blueprintjs/core/src/accessibility";
+
+// @import "~@blueprintjs/core/src/components/button/button";
+// @import "~@blueprintjs/core/src/components/button/button-group";
+// @import "~@blueprintjs/core/src/components/forms/index";

src/style.scss

@@ -1,5 +1,5 @@
-const webpack = require('webpack');
-const Path = require('path');
+// const webpack = require('webpack');
+// const Path = require('path');
 
 module.exports = function(config) {
     config.set({