royibernthal Posted July 30, 2016 Share Posted July 30, 2016 I'm compiling my TypeScript project into a single JS file, at the moment by specifying an outFile in the compiler options. In my project each class is defined in a different file. The problem is that classes that depend on each other are not concatenated in the output JS in the right order. For example, if I have class A that extends class B, it'd mean class B would have to be compiled before class A. (1) class A extends B { } //error - can't find B class B { } (2) class B { } class A extends B { } //works as expected The problem is the file order in TypeScript compile is not defined according to class dependencies, resulting in many instances of (1). It can be solved by manually defining the compile order with many lines of: /// <reference path="myFile.ts"/> however it is not ideal and can quickly become a headache in large projects. The other option from what I read is to use external modules and be able to require/import relevant classes/files. It sounds good, but it seems to only take care of ASYNC loading during runtime of the required files after each ts file has been compiled into its own js file. What I need is defining the right compile order according to class dependencies during compile time from ts to js. I googled "typescript compile order" and read thoroughly the first 10 results - meaning following references to turoials, documentations, videos, etc... It seems people have been experiencing the same problem but their questions have never been answered to satisfaction. From what I understand it should be possible to do using the CommonJS external module, but all I can understand from the answers is a general sense of what should be happening rather than a simple and straightforward answer of how to actually do it. If you know the answer, let's solve this issue once and for all Quote Link to comment Share on other sites More sharing options...
b10b Posted August 1, 2016 Share Posted August 1, 2016 Yes, I wish someone told me this when I started out with Typescript too. Have a look at using "webpack" and "import" as direct replacements for "outFile" and "reference" respectively. Initially this may feel wrong because it introduces another dependency to your project (webpack) and compiling becomes a separated task (e.g. running webpack on watch mode). Webpack does a lot more than you may initially need, but it also does that basic job well - bundling Typescript in the correct order (or rather order independent) and allowing module loading. Here's a basic tut: http://www.jbrantly.com/typescript-and-webpack/ Quote Link to comment Share on other sites More sharing options...
royibernthal Posted August 3, 2016 Author Share Posted August 3, 2016 @b10b I'm just making sure - can this take care of compiling everything in the right order into a single javascript file? (not 1 js per 1 ts) If so, would it require me to place import statements similarly to the reference tag or would the dependencies be inferred automatically? Can it handle dependency loops? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.