Added more complex ts-checker example

examples/fork-ts-checker-react-babel-karma-gulp/README.md

@@ -0,0 +1,16 @@
+# TypeScript, Babel, React, and Karma Sample
+
+## Getting started
+
+You'll need [node / npm](https://nodejs.org/) installed.  To get up and running just enter:
+
+```
+npm install
+npm run serve
+```
+
+This will:
+
+1. Download the npm packages you need (including the type definitions from DefinitelyTyped)
+2. Compile the code and serve it up at [http://localhost:8080](http://localhost:8080)
+

examples/fork-ts-checker-react-babel-karma-gulp/gulp/clean.js

@@ -0,0 +1,29 @@
+'use strict';
+
+var del = require('del');
+var gutil = require('gulp-util');
+var fs = require('fs');
+
+function run(done) {
+  fs.stat('./dist', function(err){
+    if (err) {
+      // Never existed
+      done();
+    }
+    else {
+      del(['./dist'], { force: true })
+        .then(function(paths) {
+          gutil.log('Deleted files/folders:\n', paths.join('\n'));
+          done();
+        })
+        .catch(function(error) {
+          gutil.log('Problem deleting:\n', error);
+          done();
+        });
+    }
+  });
+}
+
+module.exports = {
+  run: function(done) { return run(done); }
+};

examples/fork-ts-checker-react-babel-karma-gulp/gulp/inject.js

@@ -0,0 +1,55 @@
+'use strict';
+
+var gulp = require('gulp');
+var inject = require('gulp-inject');
+var glob = require('glob');
+
+function injectIndex(options) {
+  function run() {
+    var target = gulp.src('./src/index.html');
+    var sources = gulp.src([
+      //'./dist/styles/main*.css',
+      './dist/scripts/vendor*.js',
+      './dist/scripts/main*.js'
+    ], { read: false });
+
+    return target
+      .pipe(inject(sources, { ignorePath: '/dist/', addRootSlash: false, removeTags: true }))
+      .pipe(gulp.dest('./dist'));
+  }
+
+  var jsCssGlob = 'dist/**/*.{js,css}';
+
+  function checkForInitialFilesThenRun() {
+    glob(jsCssGlob, function (er, files) {
+      var filesWeNeed = ['dist/scripts/main', 'dist/scripts/vendor'/*, 'dist/styles/main'*/];
+
+      function fileIsPresent(fileWeNeed) {
+        return files.some(function(file) {
+          return file.indexOf(fileWeNeed) !== -1;
+        });
+      }
+
+      if (filesWeNeed.every(fileIsPresent)) {
+        run('initial build');
+      } else {
+        checkForInitialFilesThenRun();
+      }
+    });
+  }
+
+  checkForInitialFilesThenRun();
+
+  if (options.shouldWatch) {
+    gulp.watch(jsCssGlob, function(evt) {
+      if (evt.path && evt.type === 'changed') {
+        run(evt.path);
+      }
+    });
+  }
+}
+
+module.exports = {
+  build: function() { return injectIndex({ shouldWatch: false }); },
+  watch: function() { return injectIndex({ shouldWatch: true  }); }
+};

examples/fork-ts-checker-react-babel-karma-gulp/gulp/staticFiles.js

@@ -0,0 +1,31 @@
+'use strict';
+
+var gulp = require('gulp');
+var cache = require('gulp-cached');
+
+var targets = [
+  { description: 'INDEX', src: './src/index.html', dest: './dist' }
+];
+
+function copy(options) {
+  function run(target) {
+    gulp.src(target.src)
+      .pipe(cache(target.description))
+      .pipe(gulp.dest(target.dest));
+  }
+
+  function watch(target) {
+    gulp.watch(target.src, function() { run(target); });
+  }
+
+  targets.forEach(run);
+
+  if (options.shouldWatch) {
+    targets.forEach(watch);
+  }
+}
+
+module.exports = {
+  build: function() { return copy({ shouldWatch: false }); },
+  watch: function() { return copy({ shouldWatch: true }); }
+};

examples/fork-ts-checker-react-babel-karma-gulp/gulp/tests.js

@@ -0,0 +1,45 @@
+'use strict';
+
+var Server = require('karma').Server;
+var path = require('path');
+var gutil = require('gulp-util');
+
+function runTests(options) {
+  // Documentation: https://karma-runner.github.io/0.13/dev/public-api.html
+  var karmaConfig = {
+    configFile: path.join(__dirname, '../karma.conf.js'),
+    singleRun: !options.shouldWatch,
+
+    plugins: ['karma-webpack', 'karma-jasmine', 'karma-mocha-reporter', 'karma-sourcemap-loader', 'karma-phantomjs-launcher'],
+    reporters: ['mocha']
+  };
+
+  if (options.done) {
+    karmaConfig.plugins.push('karma-junit-reporter');
+    karmaConfig.reporters.push('junit');
+  } else {
+    karmaConfig.plugins.push('karma-notify-reporter');
+    karmaConfig.reporters.push('notify');
+  }
+
+  new Server(karmaConfig, karmaCompleted).start();
+
+  function karmaCompleted(exitCode) {
+    if (options.done) {
+      if (exitCode === 1) {
+        gutil.log('Karma: tests failed with code ' + exitCode);
+      } else {
+        gutil.log('Karma completed!');
+      }
+      options.done();
+    }
+    else {
+      process.exit(exitCode);
+    }
+  }
+}
+
+module.exports = {
+  run:   function(done) { return runTests({ shouldWatch: false, done: done }); },
+  watch: function()     { return runTests({ shouldWatch: true  }); }
+};

examples/fork-ts-checker-react-babel-karma-gulp/gulp/webpack.js

@@ -0,0 +1,112 @@
+'use strict';
+
+var gulp = require('gulp');
+var gutil = require('gulp-util');
+var webpack = require('webpack');
+var ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
+var ForkTsCheckerNotifierWebpackPlugin  = require('fork-ts-checker-notifier-webpack-plugin');
+var webpackFailPlugin = require('webpack-fail-plugin');
+
+var webpackConfig = require('../webpack.config.js');
+var packageJson = require('../package.json');
+
+function buildProduction(done) {
+  // modify some webpack config options
+  var myProdConfig = webpackConfig;
+  myProdConfig.output.filename = '[name].[hash].js';
+
+  myProdConfig.plugins = myProdConfig.plugins.concat(
+    new webpack.DefinePlugin({
+      'process.env': {
+        'NODE_ENV': JSON.stringify('production')
+      }
+    }),
+    new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', filename: 'vendor.[hash].js' }),
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {
+        warnings: true
+      }
+    }),
+    new ForkTsCheckerWebpackPlugin({
+      blockEmit: true,
+      // tslint: true,
+      watch: ['./src', './test'] // optional but improves performance (less stat calls)
+    }),
+    webpackFailPlugin
+  );
+
+  // run webpack
+  webpack(myProdConfig, function (err, stats) {
+    if (err) { throw new gutil.PluginError('webpack:build', err); }
+    gutil.log('[webpack:build]', stats.toString({
+      colors: true
+    }));
+
+    if (done) { done(); }
+  });
+}
+
+function createDevCompiler() {
+  // modify some webpack config options
+  var myDevConfig = webpackConfig;
+  myDevConfig.devtool = 'inline-source-map';
+
+  myDevConfig.plugins = myDevConfig.plugins.concat(
+    new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', filename: 'vendor.js' }),
+    new ForkTsCheckerNotifierWebpackPlugin ({ title: 'Build', excludeWarnings: false }),
+    new ForkTsCheckerWebpackPlugin({
+      blockEmit: false,
+      // tslint: true,
+      watch: ['./src'] // optional but improves performance (less stat calls)
+    })
+  );
+
+  // create a single instance of the compiler to allow caching
+  return webpack(myDevConfig);
+}
+
+function build() {
+  return new Promise(function (resolve, reject) {
+    buildProduction(function (err) {
+      if (err) {
+        reject(err);
+      } else {
+        resolve('webpack built');
+      }
+    });
+  });
+}
+
+function watch() {
+  var firstBuildDone = false;
+
+  return new Promise(function (resolve, reject) {
+    var devCompiler = createDevCompiler();
+    devCompiler.watch({ // watch options:
+      aggregateTimeout: 300 // wait so long for more changes
+    }, function (err, stats) {
+      if (err) {
+        if (!firstBuildDone) {
+          firstBuildDone = true;
+          reject(err);
+        }
+        throw new gutil.PluginError('webpack:build-dev', err);
+      } else {
+        if (!firstBuildDone) {
+          firstBuildDone = true;
+          resolve('webpack built');
+        }
+      }
+
+      gutil.log('[webpack:build-dev]', stats.toString({
+        chunks: false,
+        colors: true
+      }));
+    });
+  });
+}
+
+module.exports = {
+  build: function () { return build(); },
+  watch: function () { return watch(); }
+};

examples/fork-ts-checker-react-babel-karma-gulp/gulpFile.js

@@ -0,0 +1,54 @@
+/* eslint-disable no-var, strict, prefer-arrow-callback */
+'use strict';
+
+var gulp = require('gulp');
+var gutil = require('gulp-util');
+var webpack = require('./gulp/webpack');
+var staticFiles = require('./gulp/staticFiles');
+var tests = require('./gulp/tests');
+var clean = require('./gulp/clean');
+var inject = require('./gulp/inject');
+
+var lintSrcs = ['./gulp/**/*.js'];
+
+gulp.task('delete-dist', function (done) {
+  clean.run(done);
+});
+
+gulp.task('build-js', ['delete-dist'], function(done) {
+  webpack.build().then(function() { done(); });
+});
+
+gulp.task('build-other', ['delete-dist'], function() {
+  staticFiles.build();
+});
+
+gulp.task('build', ['build-js', 'build-other'], function () {
+  inject.build();
+});
+
+gulp.task('watch', ['delete-dist'], function(done) {
+  process.env.NODE_ENV = 'development';
+  Promise.all([
+    webpack.watch()//,
+    //less.watch()
+  ]).then(function() {
+    gutil.log('Now that initial assets (js and css) are generated inject will start...');
+    inject.watch();
+    done();
+  }).catch(function(error) {
+    gutil.log('Problem generating initial assets (js and css)', error);
+  });
+
+  staticFiles.watch();
+  tests.watch();
+});
+
+gulp.task('watch-and-serve', ['watch'], function() {
+  // local as not required for build
+  var express = require('express')
+  var app = express()
+
+  app.use(express.static('dist', {'index': 'index.html'}))
+  app.listen(8080);
+});