Cross-project references between two projects

Is it possible to make a reference between two TypeScript projects? Assume we have the following project structure:

Module1.ts contains:

module TestModule {
    export interface Interface1 {
    }
}

Module2.ts contains:

module TestModule {
    export interface Interface2 extends Interface1 {
    }
}

Test1 is referenced in Test2. I get an error Could not find symbol 'Interface1' in Module2.ts. It works within one project, but I don't know how to make it visible from the other project... Maybe it's not possible for now.

[Edit 1.]
When I try to use TestModule.Interface1 pattern, I get the same error (said in different way). But the IntelliSense sees my Interface1:

[Edit 2.]
I have noticed I can't use files from the other project. Even if I have a correct reference (/// <reference ...) added and linked all the files in my 1st project.

There's lots of ways you can do this.

Option 1 - Project References (TypeScript 3.0+)

If you are using TypeScript 3.0 then look at using project references. Read more here.

Option 2 - Build script

Use something like gulp-typescript, grunt-ts, or just a batch script to copy the files over into a folder in the main project.

Alternatively, run a build event in Visual Studio that will copy the files over to the main project.

Option 3 - npm package

If you use npm, you could create a package for your other project. Then you can use your package in your main project. Specifying a local dependency is a good way to do this or by using something like sinopia, which is a private repository server. I've never used it, but it looks like it would work well.

Option 4 - NuGet package

You could look into creating a nuget package and then installing it locally.

Option 5 - --declaration --outDir compiler option

You can set the --outDir compiler option or the outDir property in tsconfig.json with the directory to your other project then also compile it with --declaration so that it generates the declaration files (.d.ts) too. For example: --declaration --outDir ../Test1/External.

Original Answer (Using --out)

You can do something similar in Visual Studio if you right click on your library project and click properties. In the TypeScript Build tab, check off the option to Combine JavaScript output into file and specify the location in your main project you want it to go (Ex. $(SolutionDir)/TypedApp/External/TypedLibrary.js). Then also check off Generate declaration files in order to generate a .d.ts file.

Once this is done, build your library project and then include the .js, and .d.ts in your main project. Include the .js file in your html and reference the .d.ts in your typescript files.

Each time you rebuild the library project, it will automatically update the main project with the changes.

The solution suggested by @dhsto works but I have found an alternative using linked folders. I have written about it in detail in this article, here is how it can be implemented:

It can be achieved by creating a folder to hold your references, I like to name this “_referencesTS”, the folder will contain all of the links to files from Test1. This can be done individually but would become very cumbersome if it had to be done for each new TS file. Linking a folder however will link all of the files beneath it, this can be done by editing the csproj file.

To edit the file right click the Test2 project and click “Unload Project”, then right click the project and click “Edit Test2.csproj”. Navigate to the <ItemGroup> that contains the <TypeScriptCompile> tags and insert the code below:

<TypeScriptCompile Include="..\Test1\**\*.ts">
   <Link>_referencesTS\%(RecursiveDir)%(FileName)</Link>
</TypeScriptCompile>

Replace the relative path to the location of your TS files in Test1, this uses the wildcarding (*) to link all .ts files (dictated by the *.ts) within all sub folders (dictated by the \**\)..

The TS files within these folders will now appear linked within Test2, allowing for automatic typescript referencing.

Note: The only downside to this approach is that when a new file is added to Test1 within a linked folder, the user has to unload and load the project or close and open the solution for it to appear in Test2.

Frustrated with the state of affairs, I wrote a NuGet package that mostly solves this problem. Using the NuGet package you can just add a reference from one project to another and it will do the work of copying files around in a way that is safe from accidentally editing the wrong file and still gives intellisense and debugging.

Details can be found in the Readme.md, or you can just install the NuGet package and run (I recommend at least reading the how to use section).

https://github.com/Zoltu/BuildTools.TypeScript.FromReferences

I just want to add to the answer of David Sherret that the lib files to the TypedApp project could be added as Link files instead of depending on post build events. I'm having some issues with post build events in big solutions with a lot of projects, and the link files are now working ok for me. (I cannot add a comment to the answer because I only have 35 reputation points).

If you are compiling with the --out parameter you can simply reference Module1.ts from Module2.ts using /// <reference To learn more about code organization patterns in TypeScript see http://www.youtube.com/watch?v=KDrWLMUY0R0&hd=1

What visual studio language services sees available (which is everything) is different from what you compile and actually have available at runtime.