Generate source maps from TypeScript for easier debugging

Author: timjb

.gitignore

@@ -20,6 +20,7 @@ tags
 TAGS
 
 /haddock-api/resources/html/node_modules
+/haddock-api/resources/html/*.js.map
 
 .cabal-sandbox
 .ghc.environment.*

haddock-api/resources/html/README.md

@@ -4,10 +4,13 @@
 * Run `npm install` and `npm install gulp-cli -g` in this directory.
 * Run `gulp` in this directory. This rebuilds the minified JS files.
 
-# Manual Testing
+# Development and manual testing
 
-Generate haddock docs for some Haskell project and replace the generated JS files:
+Generate Haddock docs for some Haskell project. Start an HTTP server in the Haddock docs directory.
+(The `file://` protocol doesn't work since it doesn't allow AJAX requests.)
+
+After each change to the TypeScript sources, compile and copy the generated files (JS and sourcemaps for better debugging) to the Haddock directory:
 
 ```
-gulp && cp *.min.js path-to/generated-haddock-docs
+gulp && cp *.min.js path-to/generated-haddock-docs && cp *.js.map path-to/generated-haddock-docs
 ```

haddock-api/resources/html/gulpfile.js

@@ -4,15 +4,18 @@ const browserify = require('browserify');
 const source = require('vinyl-source-stream');
 const buffer = require('vinyl-buffer');
 const tsify = require('tsify');
+const sourcemaps = require('gulp-sourcemaps');
 
 function buildJS(targetFileName, files) {
-  var b = browserify({ entries: files });
+  var b = browserify({ entries: files, debug: true });
   return b
     .plugin(tsify)
     .bundle()
     .pipe(source(targetFileName))
     .pipe(buffer())
+    .pipe(sourcemaps.init({loadMaps: true}))
     .pipe(uglify().on('error', function(e) { console.log(e); }))
+    .pipe(sourcemaps.write('.'))
     .pipe(gulp.dest('.'));
 }