Simon_Weaver Simon_Weaver - 3 months ago 10
TypeScript Question

Visual Studio 2013 Typescript compiler isn't respecting '_references.ts' file

I'm new to Typescript and have been working the last few days within Visual Studio 2013 Update 2 (which natively includes all support).

I have the following options selected within Visual Studio on the properties page for my project.

This means that when I save a file it will automatically compile all the typescript files together and create a single

RRStore.js
file. I then just include this using the BundleManager in ASP.NET as if it were any old JS file. I am not using a module loaders since there's not much JS code.

enter image description here

To resolve dependencies in the correct order the TS compiler needs a
_references.ts
file so I created one like this :

/// <reference path="RR.ErrorHandling.ts" />
/// <reference path="RR.JQueryPlugins.ts" />
/// <reference path="RR.Util.ts" />

/// <reference path="viewmodel/UserViewModel.ts" />

/// <reference path="viewmodel/AddressViewModel.ts" />
/// <reference path="viewmodel/ProductViewModel.ts" />
/// <reference path="viewmodel/CartItemViewModel.ts" />
/// <reference path="viewmodel/CheckoutViewModel.ts" />

/// <reference path="viewmodel/StoreWizardViewModel.ts" />
/// <reference path="viewmodel/DefenderWizardViewModel.ts" />

/// <reference path="viewmodel/MainViewModel.ts" />

/// <reference path="RR.YoutubeLoader.ts" />


This file means when I hit
Ctrl+S
within Visual Studio after editing a TS file it will combine all my other TS files together in this order so things such as prototype chains are correct for inheritance.

This was working fine on
Ctrl+S
when saving a TS file.

I then had to make a change to some C# code - after which of course I needed to hit
Ctrl+F5
to build the project. To my surprise I got weird JS errors in the browser - about prototypes not existing on objects.

I looked at the generated Typescript file
RRStore.js
in the browser and examined the order of all my files and it's put the file
RR.YoutubeLoader.ts
FIRST.

That's weird! (not least because it's LAST on my list of references above.)

I went to that file and hit
Ctrl+S
, refreshed
RRStore.js
and everything is back in the right order.

In other words when I do a full build the order of files in
_references.ts
is not respected, but when I just hit
Ctrl+S
it is. What's going on?

Answer

Edit: Update: Turns out _references.ts needs to be in the root of your project to be recognized by the compiler. So that's the preferred way :-) This method works too... but please don't do this:


Original workaround:

When reading through my generated RRStore.js file I noticed the order seemed to be in an apparently random order: RR.YoutubeLoader, ProductViewModel, DefenderViewModel, StoreViewModel etc.

I realized there could be only one explanation....

I opened up the .csproj file and sure enough the compiler was processing files in the order they had been initially added to my project!!!.

So I moved the _references.ts file up to the first in the MySite.csproj file - and it is now correctly recognizing it and compiling everything in the right order.

I'm not sure if this is a known bug yet but that was an adequate solution for me.

MyProject.csproj

enter image description here

Comments