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.
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?
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With