I have a bit of a strange (but in my view sensible) scenario.

I have a web site, mobile application and maybe going forward a web server all written in Javascript. I have a huge chunk of functionality which is shared between all these systems. This shared stuff would be models, repositories, business logic etc etc.

If we exclude the web server bit as that is a future idea, the web application has a directory structure like this:

app
|- assets
|- models
|- services
|- migrations
|- view-models
|- views
|- descriptors

Now each of these applications is broken down into 2 areas, the core and ui sections, the core is the re-usable stuff such as models, services, migrations and the ui stuff is ONLY used for that application which would prise of view-models, descriptors (Incase you are wondering views are all html and assets are css, images etc).

Before I was adopting typescript I had a build script which would basically bine all the core files together and minify them. Then it would bine all the UI ones together and minify them. That way in the mobile application I can then just use the my-app.core.min.js and everyone is happy, I am reusing all the re-usable ponents from the main web application. However I do not need the ui stuff as the mobile UI is pletely different to the main web ui, and the web service would not even have a UI going forward.

SO!

With that context explained lets jump back to the Typescript problem at hand. Currently the typescript files are piled by tsc.exe (version 0.83) via a build script, which just wraps the interaction.

So in the new Typescript world the structure now has a references folder like so:

app
|- assets
|- models
|- services
|- migrations
|- view-models
|- views
|- descriptors
|- references <- NEW ONE!

This references folder is automatically populated by the build script with all local references, so it will trawl through the whole directory tree find all typescript files and build a huge reference file, which is a file full of the reference declarations for local typescript file, to find out more about what im on about look over this question:

Can you create Typescript packages? like c# dlls

So now when I run the build script the following steps happen:

---

Compiling for Core

1. Find all *.ts files within the models, services, migrations folders and subfolders
2. Add all the previous files into an array and also add in the reference files
3. run tsc.exe with a mand like so tsc.exe --out <something>.core.js <previous_file_list>

Compiling for UI

1. Find all *.ts files within the view-models, descriptors folders and subfolders
2. Add all the previous files into an array and also add in the reference files
3. run tsc.exe with a mand like so tsc.exe --out <something>.ui.js <previous_file_list>

Now I was expecting this to output 2 files my-app.core.js which ONLY contained the core files, and a my-app.ui.js which ONLY contained the ui files. However they both include everything...

Now after thinking about this, it must be due to the references, as they are both referencing all files, however thats just a pilation dependency in my eyes, not something that needs to be piled WITH the outputted javascript. In c#/java you would not expect a referenced dll/jar to be piled into your outputted dll/jar, its just a runtime dependency which is required.

I have tried having 2 separate reference files, one for core and one for ui, but as the ui will depend on core I get same problem, although at least this way the my-app.core.js is devoid of any ui related guff.

So is there a way to have references but NOT have them be outputted into the generated javascript files?

I have a bit of a strange (but in my view sensible) scenario.

I have a web site, mobile application and maybe going forward a web server all written in Javascript. I have a huge chunk of functionality which is shared between all these systems. This shared stuff would be models, repositories, business logic etc etc.

If we exclude the web server bit as that is a future idea, the web application has a directory structure like this:

app
|- assets
|- models
|- services
|- migrations
|- view-models
|- views
|- descriptors

Now each of these applications is broken down into 2 areas, the core and ui sections, the core is the re-usable stuff such as models, services, migrations and the ui stuff is ONLY used for that application which would prise of view-models, descriptors (Incase you are wondering views are all html and assets are css, images etc).

Before I was adopting typescript I had a build script which would basically bine all the core files together and minify them. Then it would bine all the UI ones together and minify them. That way in the mobile application I can then just use the my-app.core.min.js and everyone is happy, I am reusing all the re-usable ponents from the main web application. However I do not need the ui stuff as the mobile UI is pletely different to the main web ui, and the web service would not even have a UI going forward.

SO!

With that context explained lets jump back to the Typescript problem at hand. Currently the typescript files are piled by tsc.exe (version 0.83) via a build script, which just wraps the interaction.

So in the new Typescript world the structure now has a references folder like so:

app
|- assets
|- models
|- services
|- migrations
|- view-models
|- views
|- descriptors
|- references <- NEW ONE!

This references folder is automatically populated by the build script with all local references, so it will trawl through the whole directory tree find all typescript files and build a huge reference file, which is a file full of the reference declarations for local typescript file, to find out more about what im on about look over this question:

Can you create Typescript packages? like c# dlls

So now when I run the build script the following steps happen:

---

Compiling for Core

1. Find all *.ts files within the models, services, migrations folders and subfolders
2. Add all the previous files into an array and also add in the reference files
3. run tsc.exe with a mand like so tsc.exe --out <something>.core.js <previous_file_list>

Compiling for UI

1. Find all *.ts files within the view-models, descriptors folders and subfolders
2. Add all the previous files into an array and also add in the reference files
3. run tsc.exe with a mand like so tsc.exe --out <something>.ui.js <previous_file_list>

Now I was expecting this to output 2 files my-app.core.js which ONLY contained the core files, and a my-app.ui.js which ONLY contained the ui files. However they both include everything...

Now after thinking about this, it must be due to the references, as they are both referencing all files, however thats just a pilation dependency in my eyes, not something that needs to be piled WITH the outputted javascript. In c#/java you would not expect a referenced dll/jar to be piled into your outputted dll/jar, its just a runtime dependency which is required.

I have tried having 2 separate reference files, one for core and one for ui, but as the ui will depend on core I get same problem, although at least this way the my-app.core.js is devoid of any ui related guff.

So is there a way to have references but NOT have them be outputted into the generated javascript files?

• javascript
• reference
• typescript
• build-script

Share Improve this question Follow edited May 23, 2017 at 12:00 CommunityBot 111 silver badge asked Apr 9, 2013 at 10:37 GrofitGrofit 18.5k2525 gold badges103103 silver badges187187 bronze badges 3

• 1 possible duplicate of How can typescript generate single one javascript file without reference typescript file code - although I think you may be better off using a module loader rather than fiddling about with all these files and bining some of them. – Fenton Commented Apr 9, 2013 at 14:40
• I use LabJS (or YepNope) depending upon the client/platform, to load the bined stuff later, the build script and application is quite plex, however I have diluted it down to a simple problem as mentioned above. You are right it is basically a more verbose version of the question you linked to. The code generated here is also used as a contract for other people to make plugins for the system, so I am generating these files not just for runtime but for 3rd party contracts too. – Grofit Commented Apr 9, 2013 at 15:30
• I think the linked question up top is similar, as is stackoverflow./questions/13461758/… that one. However all these feel like work arounds for the piler doing a bulk include on the --out argument, rather than just including the files passed. Does anyone know if this is being addressed in the piler, as I remember reading that if you have a file which references another and you build that single file its fine, no references are included, however if you do the same with the --out flag it will include both. – Grofit Commented Apr 10, 2013 at 9:35

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

You can acplish this by generating definition files for your TypeScript files:

tsc --declaration FileName.ts

In your build script do this for each TypeScript file and use the generated FileName.d.ts as the reference instead of FileName.ts

I had the following files:

-BusinessObjects
--Product.ts
--Customer.ts
--Order.ts
--BusinessObjects.d.ts

BusinessObjects.d.ts looks like this:

/// <reference path="Customer.d.ts" />
/// <reference path="Order.d.ts" />
/// <reference path="Product.d.ts" />

with Product, Customer, and Order each have a reference to BusinessObjects.d.ts

when I run:

tsc --out bine.js Customer.ts Order.ts

The output only references Customer and Order, Product is not included. When I referenced the *.ts files directly in my BusinessObjects.d.ts file however the bined output did include the unwanted file.