Tip #108 Did you know … How to improve reference efficiency in JavaScript files inside a web project?

In Visual Studio 2010, we can reference other JavaScript files inside current JavaScript file like the following, to get the IntelliSense.

/// <reference path="JScript2.js" />

What if you have many JavaScript files and you’ve to reference many project wide JavaScript files inside each file?  You can put the following block in each of the JavaScript files that need the reference like following:

/// <reference path="JScript1.js" />
/// <reference path="JScript2.js" />
/// <reference path="JScript3.js" />
/// <reference path="JScript4.js" />

But this won’t be efficient especially some referencing file name is going to change, such as when JQuery library version changes.  The trick is to create a project wide reference JavaScript file, and explicitly reference this file from other JavaScript files.  For example, we can create a file called reference.js which contains the above code.  Then for other JavaScript files, we can reference it by dragging and drop the reference.js file into the JavaScript editor, which will generate the following:

/// <reference path="Scripts/reference.js" />

Basically, Visual Studio 2010 recursively check the references included in the referenced JavaScript files to find the current JavaScript file’s references.  I hope this can ease some pain in the development.

Best Regards

Xinyang Qiu

Web Platform And Tools