How to organize our javascript in multiple visual studio projects

Question

In our solution in VS2012 we have multiple web applications that all require javascript. We developed a single page application using Telerik's Kendo UI for MVC4 ASP.Net in combination with jQuery and TypeScript.

Because of the multiple Web Applications we created a lot of redundant TypeScript and thus Javascript. Changing code is a drag. We have to synchronize all of the code for all of the Web Applications all the time and that is annoying to say the least.

I've investigated several solutions to this problem and have come up empty. Here are a few of the scenario's I investigated:

Links in Visual Studio

One can drag a whole 'Folder' from one project to another holding the Alt key. This causes links in that destination project for all the files in the source project. This works fine inside Visual Studio for editing. The problem here is that at runtime the application needs the files to be in the location on disk inside the hierarchy of the web application executing. Because they are links to another location the server can not find the files.

Dropped this solution.

Symbolic links on disk

With the 'mklink' command in windows one can create so called 'symbolic links'. This works like a charm in visual studio. One can add the existing (symbolic) directories into visual studio by dragging them from the File Explorer into the tree of the Web Application. You can then edit the files and changes are immediately reflected in the original location. We got the projects running with this and thought we had the solution to our problem until we wanted to check this into Subversion. Subversion thinks it is a real folder and tries to check in the files with the version information from the original location. After several frustrating hours of trial and error I gave up on this solution too. We tried symbolic links and junction points but in both cases we couldn't get this to work.

Dropped this solution.

More investigation

I also looked at the solution used in ASP.Net applications using the WebResources.asxd in combination with JavaScript as embeded resources. We dropped that one too because, set asside from the increased complexity, it would increase our turn-arround time during development too much. We would have to build the solution for each change in some JavaScript file so we would loose the very fast editing possibilities we now have. We now can simply change a JavaScript, save it to disk and refresh the browser for changes to become active.

The option above we liked best is the one with the symbolic links but we have not found a work arround the problems with SubVersion with that one.

Answer 1

If you want to have symlink-like references in Subversion repository, you should definitely consider svn:externals :

• "Externals Definitions" ,
• "Use svn:externals" .

This way you can create links to your common code.

Answer 2

Have you considered creating a NuGet package for your javascript? It's a nice way to manage dependencies and you can create a local feed for this.

If you had been using git for version control I could have suggested using submodules instead. AFAIK svn does not have an equivalent. Correction: see @bahrep's answer.

Answer 3

We had a similar problem, except we generate a TypeScript file from a T4 template in one project, and needed that same file to reference in our Web project. We tried linked files and had the same problem.

What we ended up doing is using a Pre-Build Event to simply xcopy the file from one folder to another. Now, we're using TFS, which will automatically check out the destination file when copying. We do have both files under source control, which is a bit of a waste, but the benefit of sharing the code outweighs that, in our case. Your mileage may vary.

Answer 4

Interesting question, I know I'm Lil late to the party but here's my take on the problem.

Using Private NPM repo

Create a TS project with all your Common Code publish as NPM package to private NPM server (if you don't want it to be public) otherwise, you can always publish it to public NPM.

This is a bit complex and has many moving parts like creating and managing a Private NPM server or buying one, updating your NPM modules in the project as and when needed, but I guess this would do the trick

Using CDN

Keep a separate repository for your TS/JS files, host that, and wherever you want that put a link to that deployed JS.

Ref : How to create private NPM server