If you downloaded Visual Studio 11 Beta, and tried to create a new ASP.NET MVC 4 empty project, looking at the “Scripts” folder, you’ll see this new file “_references.js”:

image

Which looks like the following:

The VS <reference /> Syntax

As you probably know, the `// <reference path=”…” />` syntax was introduced in Visual Studio long time ago to make you able to have intellisense in any JavaScript file to include everything defined in the JavaScript located at this path.

In easier words, if you write the very first line in any JavaScript file, say “my-page.js”, and make sure the path points to the proper jQuery file, when you write code in “my-page.js”, you’ll get intellisense for everything in the jQuery file. The quality of the intellisense will vary based on the referenced jQuery file, whether it’s minified file (least intellisense info, only member names, sometimes), just standard source/debug file, or even one that VsDoc comments (best intellisense, might even have notes on what types you need to pass to methods, when defined in VsDoc comments).

The Resharper Way

If you are using Resharper 6 or so, Resharper will give you intellisense from all files in the project. Generally speaking this is a good thing, but it has two drawbacks:

  • If you have so many JavaScript files in the project (for example, number of common files plus a file or two for every page in a big project), the JavaScript editor experience can be bit slow in times, as Resharper tries to evaluate all the JS files to get you intellisense
  • When you type the first letters of a member, the intellisense menu will bring so many results, because it will include all possible members from all files in the project, even the ones completely unrelated to what you are doing now. The way Resharper tries to make this less severe, is that it tells you which file it picked every intelisense item from.

The Visual Studio 2012 Way: Or The _references.js File

In VS 11, Visutal Studio will give you intellisense from all files that have references in the “_references.js” file. This way you can define the global / common files you use all the time. This might include some library files like jQuery, or some files you use everywhere in the project like some internal utilities files.

For related files, you can use the “<reference >” syntax on top of every file to connect them (from intellisense point of view).

File Location

Note that there is only one _references.js file for each project. It doesn’t work like web.config where you have have web.config files in site folders affecting only those folders.  An _references.js file in any other location than “~/Scripts/_references.js” will be just like any other JS file and won’t be used for global intellisense. Even putting the file in the root of your web project will not work as well.

Update (March 21, 2012)

After reading Scott Hanselman’s post on hidden web features in Visual Studio 11 beta (posted yesterday), turns out you can add files to the global JavaScript intellisense from the Visual Studio Tools –> Options Dialog:

image

In the options windows, go to Text Editor –> JavaScript –> Intellisense –> References node in the tree view at the left, then from the dialog that comes, choose “Implicit (Web)” for “Reference Group”. You can see that the _references.js file itself is just an entry in the list, and you can add other entries below.

You can pick specific files, or use the “~/path-to-file” to use a path relative to the root of your web project.

Now that we're done, click this out ;)

, , , , ,
  • http://profiles.google.com/tiendq Tien Do

    Thanks, it doesn’t work that way automatically with VS2010 but at least now I need only refer to _references.js to get intellisence of all js files.

  • jmosselman

    The “~/Scripts/_references.js” location is not fixed. You can change it in the Options of VS11: TextEditor -> Javascript -> IntelliSense -> References -> Reference Group: Implicit (Web)

  • test

    test

  • zinzinzibidi

    Where is the fucking _references.js file?!?!?!?!?!

    Where can I download this shit?!?!?!?!?

  • Michael

    I noted that if you go to the scripts folder and right click to add a new item you will have the option of adding a _references.js file. And that will automagically just add all the scripts in your projects to it.

  • Pingback: Alex Borodulin (alexborodulin) | Pearltrees