feat(build): add build:watch task to rebuild library on change on *.ts, *.html, *.scss files

Closes #98

Author: tinesoft

README.md

@@ -56,6 +56,8 @@ If you find next sections way too long, here is a quick summary for you:
 * **Library main tasks**:
   * Testing Library: `gulp test`
   * Building Library: `gulp build`
+  * Watching source files and auto-rebuilding Library: `gulp build:watch`
+  * Watching source files and auto-rebuilding Library (without running tests): `gulp build:watch-fast`
   * **Releasing Library**: `gulp release --version=[major|minor|patch]`
 * **Demo app main tasks**:
   * **Serving demo app**: `gulp serve:demo`
@@ -277,6 +279,8 @@ Here are the most important `gulp` tasks to use during your development workflow
 Task                    | Purpose
 :-----------------------|:--------------------------------------------------------------------------------------------------------------------------------------------------
 `gulp build`            | Builds and packages your library under the `dist/` folder.
+`gulp build:watch`      | Watches the source files (*.ts, *.html and *.scss) and re-builds your library upon changes (useful for live refresh of demo app during development).
+`gulp build:watch-fast` | Watches the source files (*.ts, *.html and *.scss) and re-builds your library upon changes (without running tests).
 `gulp test`             | Launches the tests (`*.spec.ts`) you wrote in `src/` and run code coverage on them. The coverage report can be found in `coverage/` folder
 `gulp test:watch`       | Launches tests in watch mode. Every changes in `*.spec.ts` 
 `gulp test:watch-no-cc` | Same as `gulp test:watch` but files do not get instrumented for code coverage (useful for debugging)

app/templates/_gulpfile.js

@@ -261,21 +261,37 @@ gulp.task('ng-compile',() => {
     });
 });
 
-// Lint, Prepare Build, <% if(!skipStyles) { %>, Sass to css, Inline templates & Styles<% } %> and Compile
+// Lint, Prepare Build, <% if(!skipStyles) { %>, Sass to css, Inline templates & Styles<% } %> and Ng-Compile
 gulp.task('compile', (cb) => {
   runSequence('lint', 'pre-compile', 'inline-templates', 'ng-compile', cb);
 });
 
-// Watch changes on (*.ts, *.html<% if(!skipStyles) { %>, *.sass<% } %>) and Compile
-gulp.task('watch', () => {
-  gulp.watch([config.allTs, config.allHtml, <% if(!skipStyles) { %>config.allSass<% } %>], ['compile']);
-});
-
 // Build the 'dist' folder (without publishing it to NPM)
 gulp.task('build', ['clean'], (cb) => {
   runSequence('compile', 'test', 'npm-package', 'rollup-bundle', cb);
 });
 
+// Same as 'build' but without cleaning temp folders (to avoid breaking demo app, if currently being served)
+gulp.task('build-watch', (cb) => {
+  runSequence('compile', 'test', 'npm-package', 'rollup-bundle', cb);
+});
+
+// Same as 'build-watch' but without running tests
+gulp.task('build-watch-no-tests', (cb) => {
+  runSequence('compile', 'npm-package', 'rollup-bundle', cb);
+});
+
+// Watch changes on (*.ts, *.html<% if(!skipStyles) { %>, *.sass<% } %>) and Re-build library
+gulp.task('build:watch', () => {
+  gulp.watch([config.allTs, config.allHtml, <% if(!skipStyles) { %>config.allSass<% } %>], ['build-watch']);
+});
+
+// Watch changes on (*.ts, *.html<% if(!skipStyles) { %>, *.sass<% } %>) and Re-build library (without running tests)
+gulp.task('build:watch-fast', () => {
+  gulp.watch([config.allTs, config.allHtml, <% if(!skipStyles) { %>config.allSass<% } %>], ['build-watch-no-tests']);
+});
+
+
 /////////////////////////////////////////////////////////////////////////////
 // Packaging Tasks
 /////////////////////////////////////////////////////////////////////////////
@@ -448,26 +464,6 @@ gulp.task('test:demo', () => {
   return execDemoCmd('test --preserve-symlinks', { cwd: `${config.demoDir}`});
 });
 
-gulp.task('test:demo-ssr', () => {
-  // Load zone.js for the server.
-  require('./demo/node_modules/zone.js/dist/zone-node');
-
-  // Import renderModuleFactory from @angular/platform-server.
-  var renderModuleFactory = require('./demo/node_modules/@angular/platform-server').renderModuleFactory;
-
-  // Import the AOT compiled factory for your AppServerModule.
-  // This import will change with the hash of your built server bundle.
-  var AppServerModuleNgFactory = require('./demo/dist-server/main.bundle').AppServerModuleNgFactory;
-
-  // Load the index.html file.
-  var index = require('fs').readFileSync('./demo/src/index.html', 'utf8');
-
-  // Render to HTML and log it to the console.
-  return renderModuleFactory(AppServerModuleNgFactory, { document: index, url: '/' }).then(html => {
-    console.log(html);
-  });
-});
-
 gulp.task('serve:demo', () => {
   return execDemoCmd('serve --preserve-symlinks<% if(useCompodoc){ %> --proxy-config proxy.conf.json<% } %>', { cwd: `${config.demoDir}` });
 });