TypeScript compiling as a single JS file
Using the GUI
If you have Visual Studio 2013 and the TypeScript extension installed, right-click your project in the solution explorer and chose Properties
. Click on the TypeScript Build
tab. Select Combine JavaScript output into file:
and type in a name to use for your combined file in the input field right next to the option. Remember you can use variables in this field. For example: "$(ProjectDir)dist\js\myCombinedFile.js".
Manually
If you cannot find this GUI option anywhere, then modify your project configuration file manually. Go to your project folder; right-click the project in the solution explorer and click on Open folder in File Explorer
. In the folder that pop up, you'll see a couple of files. Edit file myProject.csproj
with any text editor of your choice. Find two lines that reads like so:
<PropertyGroup Condition="'$(Configuration)' == 'Debug'">
and
<PropertyGroup Condition="'$(Configuration)' == 'Release'">
Within the two tree of child nodes, add a new child to each parent:
<TypeScriptOutFile>$(ProjectDir)dist\js\myCombinedFile.js</TypeScriptOutFile>
When you get back to Visual Studio, he should ask you whether or not to reload the project. Of course this is something that has to be done for the changes to take effect!
The manual procedure I just described is exactly what the GUI procedure would do for you. My thoughts around the manual procedure originates from this source.
Finally
Build your project as you would do normally. If it doesn't work, try reloading your project.
You have to use command line arguments of compiler
--outFile FILE
Concatenate and emit output to single file
example
tsc --outFile modules.js main.ts app.ts
You do not need any third-party tool or library for this.
You can use Microsoft's System.Web.Optimization:
BundleTable.Bundles.Add(new ScriptBundle("~/scripts/bundle.js").IncludeDirectory("~/scripts/", "*.js", true));
All the *.js files (results of compiling your *.ts files) will be combined and accessible at runtime at:
http:// .../scripts/bundle.js