Introduce incremental TS builds to speed dev.

gulpfile.js

@@ -2,12 +2,18 @@
 
 var gulp = require('gulp'),
     del = require('del'),
-    electron = require('gulp-atom-electron'),
+    electron = require('electron-connect').server.create(),
     symdest = require('gulp-symdest'),
     sass = require('gulp-sass'),
     shell = require('gulp-shell'),
     config = require("./project-config"),
-    runSeq = require('run-sequence');
+    runSeq = require('run-sequence'),
+    newer = require('gulp-newer'),
+    ts = require('gulp-typescript'),
+    merge = require('merge2'),
+    tsProject = ts.createProject({
+        declaration: true, noExternalResolve: false, 
+        experimentalDecorators: true, moduleResolution: 'node'});
 
 /**
  * Cleans our distribution folder
@@ -59,13 +65,36 @@ gulp.task('electron:copy', () => {
     });
 });
 
+/**
+ * Copies the following into the distribution folder:
+ *  1. NOT ANY Node modules! Use copy if you need them.
+ *  2. NOT ANY Bower packages! Use copy if you need them.
+ *  3. Any other remaining files in our `src`
+ *     directory
+ */
+gulp.task('electron:copy-newer-non-TS-sources', () => {
+    var fs_setup = [
+        { // copy assets from our source to distribution
+            from: ['./src/**/*', '!./src/**/*.scss', '!./src/**/*.ts'],
+            to: './dist'
+        }
+    ];
+
+    return fs_setup.map((setup) => {
+        return gulp.src(setup.from)
+            .pipe(newer({ map: (fn) => { return fn.replace('src', 'dist').replace('.ts', '.js'); } }))
+            .pipe(gulp.dest(setup.to));
+    });
+});
+
 /**
  * Transpiles our Sass classes into CSS and
  * places it in the matching folder hierarchy in
  * the distribution folder.
  */
 gulp.task('electron:transpile:sass', function () {
     gulp.src('./src/**/*.scss')
+        .pipe(newer({ map: (fn) => { return fn.replace('src', 'dist').replace('.scss', '.css'); } }))
         .pipe(sass().on('error', sass.logError))
         .pipe(gulp.dest('./dist'));
 });
@@ -85,11 +114,16 @@ gulp.task("sass:watch", function () {
 gulp.task('electron:transpile:ts', shell.task(['tsc']));
 
 /**
- * Watches our TypeScript files, invoking the `tsc` compiler
- * if changes are detected.
+ * Incrementally Transpiles new or changed TypeScript files to JavaScript files
  */
-gulp.task("typescript:watch", function () {
-    gulp.watch('./src/**/*.ts', ['electron:transpile:ts']);
+gulp.task('electron:transpile:ts-newer', function() {
+    let tsResult = gulp.src(['src/**/*.ts', 'typings/**/*.ts'])
+        .pipe(newer({ map: (fn) => { return fn.replace('src', 'dist').replace('.ts', '.js'); } }))
+        .pipe(ts(tsProject));
+    return merge([ // Merge the two output streams, so this task is finished when the IO of both operations are done.
+        tsResult.dts.pipe(gulp.dest('./typings')),
+        tsResult.js.pipe(gulp.dest('./dist'))
+    ]);
 });
 
 /**
@@ -148,4 +182,33 @@ gulp.task('electron:package', (done) => {
 
 gulp.task('build', ['electron:build']);
 
+gulp.task('start', function () {
+  // Start browser process
+    electron.start(['dist']);
+});
+
+gulp.task('electron:reload', function () {
+  // Start browser process
+    electron.reload();
+});
+gulp.task('reload', ['electron:reload']);
+
+gulp.task('livesourcesync', function () {
+  // Start browser process
+  electron.start(['dist']);
+
+  // Restart browser process (basically restart the whole thing)
+  //  gulp.watch('src/**', electron.restart);
+
+  // Reload renderer process
+  gulp.watch(['src/**.ts'], () => {
+      runSeq('electron:transpile:ts-newer', 'reload');
+  });
+  gulp.watch(['src/**', '!src/**.ts'], () => {
+      runSeq('electron:copy', 'reload');
+  });
+
+});
+gulp.task('dev', ['livesourcesync']);
+
 gulp.task('default', ['build']);

package.json

@@ -4,7 +4,9 @@
   "main": "gulpfile.js",
   "scripts": {
     "build": "gulp build",
-    "start": "npm run build && electron dist",
+    "start": "npm run build && gulp start",
+    "startup": "gulp start",
+    "dev": "gulp dev",
     "package": "npm run build && gulp electron:package",
     "postinstall": "concurrently \"bower install\" \"typings install\""
   },
@@ -31,11 +33,13 @@
     "concurrently": "^2.0.0",
     "del": "^2.2.0",
     "electron": "^1.3.3",
+    "electron-connect": "^0.4.8",
     "gulp": "^3.9.1",
-    "gulp-atom-electron": "^1.9.0",
+    "gulp-newer": "^1.2.0",
     "gulp-sass": "^2.3.1",
     "gulp-shell": "^0.5.2",
     "gulp-symdest": "^1.0.0",
+    "gulp-typescript": "^2.13.6",
     "run-sequence": "^1.1.5",
     "typescript": "^1.8.10",
     "typings": "^1.3.2"

src/index.js

@@ -4,6 +4,7 @@ const electron = require('electron'),
   BrowserWindow = electron.BrowserWindow;
 
 const { ipcMain } = require('electron');
+const client = require('electron-connect').client;
 
 var mainWindow = null;
 
@@ -16,7 +17,7 @@ app.on('window-all-closed', function() {
 app.on('ready', function() {
   mainWindow = new BrowserWindow({width: 800, height: 600});
   mainWindow.loadURL('file://' + __dirname + '/index.html');
-  mainWindow.webContents.openDevTools();
+  // mainWindow.webContents.openDevTools();
   mainWindow.on('closed', function() {
     mainWindow = null;
   });