I'm working in an angular 2 typescript app which has gulp tasks gulp build which transpiles to js and bundles and minifies it and gulp task gulp build:dev which does the same thing but without the minifying and bundling.
If I comment out this line in app.module.ts:
import { ClipboardModule } from 'ngx-clipboard';
Then the gulp tasks both work. But if I uncomment the line, then no javascript is output from both of the gulp tasks.
There are no error messages. How is this possible? I can't think of what can be going on, that would cause that one line of code to stop a gulp task working. Has anyone had a similar issue?
gulpfile.js
gulp.task('build', function (callback) {
runSeq('clean', 'copy', 'scripts', 'styles', callback);
});
gulp.task('clean', ['clean:app', 'clean:css', 'clean:images', 'clean:lib', 'clean:root', 'clean:rootconfig', 'clean:rootall']);
//copy files
gulp.task('copy', function(callback) {
//runSeq('clean:lib', 'copy:libs', 'copy:images', 'copy:config', 'copy:html', 'copy:configjson', callback);
runSeq('clean:lib', 'copy:libs', 'copy:images', 'copy:config', 'copy:html', 'copy:configjson', 'copy:schema', callback);
});
gulp.task('scripts', function(callback) {
runSeq(['clean:js'], 'ts', 'bundle:js', 'minify:js', callback);
});
gulp.task('styles', function(callback) {
//runSeq('clean:css', ['compile:less', 'compile:css'], 'minify:css', 'del:css', callback);
runSeq('clean:css', 'copy:css', ['compile:less'], 'minify:css', 'del:css', callback);
});
Common.js modules are not compatible with TypeScript. When building for web browserify, the gulp pipeline must be provided.
The example configuration should look like this:
gulp.task("default", ["copy-html"], function () { return browserify({ basedir: '.', debug: true, entries: ['src/main.ts'], cache: {}, packageCache: {} }) .plugin(tsify) .bundle() .pipe(source('bundle.js')) .pipe(gulp.dest("dist")); });Full example and additional information here: https://www.typescriptlang.org/docs/handbook/gulp.html