How to merge TypeScript output into multiple files in VisualStudio

Question

I am working on a web application that contains several SPA applications (AngularJS), the front end code is TypeScript. I like the VisualStudio function, which combines JavaScript output into a single file, because I don't want too many JavaScript files. Is there a way to configure it so that it still merges the files, but creates several of them, one on the SPA, say, based on the folder?

I would like VS to do this, without any external tools.

thanks

Answer 1

You can for sure. There are currently two options that are widespread (sorry for the layout, the layout doesn’t seem to like me):

• ASP.NET Bundles (in Visual Studio by default .\App_Start\BundleConfig.cs ) - for more information about the collection see http://go.microsoft.com/fwlink/?LinkId=301862 ):

   bundles.Add(new ScriptBundle("~/bundles/modernizr") .Include("~/Scripts/modernizr-*")); bundles.Add(new ScriptBundle("~/bundles/bootstrap") .Include("~/Scripts/bootstrap/3.0.0/bootstrap.js", "~/Scripts/respond.js")); 

• gulp-concat (external, but pretty simple to implement):

   /** bundle and uglify app JS output files. */ gulp.task('bundle-app-uglify', ['compile-app'], function () { // concat and uglify source scripts gulp.src(config.allAppJsFiles) .pipe(uglify()) .pipe(concat(config.appBundleNameMinified)) .pipe(header(config.libraryHeaderTemplate, { organization : config.libraryOrganization, url: config.libraryUrl, license: config.libraryLicense, version: config.libraryVersion, currentDate: new Date().toISOString() })) .pipe(gulp.dest(config.bundleFolder)); });