How do I share common typescript code from one VS2013 project into a separate VS2013 project

Question

I have Visual Studio 2013, Typescript 1.3, and Module System set to AMD (requirejs 2.1.15 pulled down via Nuget, Type definitions for RequireJS 2.1.8)

I want to have a Web Application, let's call it MyWebApplication1, that has a simple html page which includes a javascript file that is generated from my typescript, eg. MyTypescript.ts

MyHtml.html:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script type="text/javascript" src="Scripts/require.js" data-main="Scripts/requireConfig.js">   </script>
</head>
<body>
    <div id="result">DEFAULT</div>
</body>
</html>

requireConfig.ts:

require.config({
    baseUrl: 'Scripts',  
});
require([ '../Scripts/MyTypescript'],
    function (MyTypescript) {
        MyTypescript.MyFunction("Mr Anderson");
    }
);

MyTypescript.ts:

import MyCommonResource = require("MyCommonResource");
export = MyApp;
module MyApp {
    export function MyFunction(myParameter: string) {
        var aString: string = (new Date()).toTimeString() ;
        var myCommonThing: MyCommonResource.CommonClass = new MyCommonResource.CommonClass();
        aString = myCommonThing.CommonMethod();
        alert("HELLO " + myParameter + " @  " + aString);
    }
}

MyCommonResource.ts:

export = MyCommon;
module MyCommon {
    export class CommonClass {
        constructor() { }
        public CommonMethod(): string {
            return "COMMON";
        }
    }
}

This all works fine with the following folder structure in one project:

MyWebApplication1
  -Scripts
    -MyTypescript.ts
    -MyCommonResource.ts
    -requireConfig.ts
  -MyHtml.html

However, I want something like this (a separate project that may be needed by various web projects)

MyWebApplication1
  -Scripts
    -MyTypescript.ts
    -requireConfig.ts
  -MyHtml.html
MyCommonWebCode1
  -Scripts
    -MyCommonResource.ts

I don't see a good way to accomplish this, without having something like this in MyTypescript.ts:

import MyCommonResource = require("..\..\AnotherProject\Scripts\MyCommonResource");

Which won't work for deployment under IIS, because the generated js define would look like this:

define(["require", "exports", "..\..\AnotherProject\Scripts\MyCommonResource"], function (require, exports, MyCommonResource) {

Is there a good solution for this situation?

I have considered using post build events, using a local nuget server,...there just doesn't seem to be a nice way of handling common bits of code in different web apps when using typescript and visual studio though.

Thanks in advance.

Answer 1

You have already mentioned what I think is the right option.

If you have code you want to share across multiple projects, a package manager is the perfect way to share it. Not only does it aid the distribution of the shared code, it also helps with versioning.

There are some neat extensions that make NuGet package creation really easy - I am using NuGet Packager .

You can use the free edition of Pro Get to get started - it is a really neat NuGet server.

You can also use your local NuGet server as a proxy to keep versions of other libraries consistent, keep a list of "team-approved" packages and to ensure you have checked licenses and kept to license conditions (rather than having to check if anyone has added a new package).

If you prefer a different package manager (ie npm) you can pretty much follow the same pattern as the features are very similar.

How do I share common typescript code from one VS2013 project into a separate VS2013 project

Question

1 answers

solution1
0 ACCPTED 2014-12-01 20:15:17

How do I share common typescript code from one VS2013 project into a separate VS2013 project

Question

1 answers

solution1 0 ACCPTED 2014-12-01 20:15:17

solution1
0 ACCPTED 2014-12-01 20:15:17