Enable ECMA Client Object Model (JSOM) IntelliSense in Visual Studio 2012\2013

Enable ECMA Client Object Model (JSOM) IntelliSense in Visual Studio 2012\2013

The SharePoint ECMA Client Object Model (JSOM) is a part of SharePoint Client Object Model (SCOM) that intended for accessing and manipulating SharePoint objects by using JavaScript (JavaScript) in an asynchronous.

This article shows you how to enable IntelliSense for the JSOM in the Microsoft Visual Studio 2012 and 2013 development environment.

In Visual studio 2010 and SharePoint 2010, when we want to enabling ECMA Client Object Model IntelliSense; every type of SharePoint component (Application Pages, Visual Web Part and so on) need specific steps to add IntelliSense. But on Visual Studio 2012\2013 the same steps are applied to your project.

How to enable JSOM IntelliSense for a SharePoint Project:

I assumes that you have created a project in Visual Studio 2012/2013 by using the Empty SharePoint Project or App for SharePoint template:
 

  1. In the Solution Explorer window, right-click the project node, point to Add, and then click New Folder.
  2. Rename the new folder to “scripts”.
  3. Add new JavaScript file to scripts folder and name it _references.js name.

A reference directive (_references.js) enables Visual Studio to establish a relationship between the script you are currently editing and other scripts. These scripts reference could be any kind of scripts files, it’s could be JSOM files under _layout directory, other script file in your project, disk-based script files or global script files that have http:// prefix.

Note: Should be only one _references.js file for each project and is located should be in the scripts directory.

You create a reference directive in the form of an XML comment. The following example shows using JSOM reference directives:

/// <reference path="~/_layouts/15/init.js" />
/// <reference path="~/_layouts/15/SP.Core.js" />
/// <reference path="~/_layouts/15/SP.Runtime.js" />
/// <reference path="~/_layouts/15/SP.UI.Dialog.js" />
/// <reference path="~/_layouts/15/SP.js" />

Now you can use IntelliSense feature when you write your JSOM code:





Note: Sometime you apply all previous steps but Visual Studio don’t catch the added reference directives, and the IntelliSense don’t work. Don’t worry it’s not your fault, just restart the Visual Studio and IntelliSense shall work correctly.

Example Download

Leave a Comment
  • Please add 8 and 8 and type the answer here:
  • Post
Wiki - Revision Comment List(Revision Comment)
Sort by: Published Date | Most Recent | Most Useful
Comments
  • Gokan Ozcifci edited Revision 4. Comment: Removed SharePoint Tag  

  • Carsten Siemens edited Revision 3. Comment: Added tag: en-US

  • Muawiyah Shannak edited Revision 2. Comment:  restart the Visual Studio  

  • Muawiyah Shannak edited Original. Comment: add note

Page 1 of 1 (4 items)
Wikis - Comment List
Sort by: Published Date | Most Recent | Most Useful
Posting comments is temporarily disabled until 10:00am PST on Saturday, December 14th. Thank you for your patience.
Comments
  • Muawiyah Shannak edited Original. Comment: add note

  • Muawiyah Shannak edited Revision 2. Comment:  restart the Visual Studio  

  • Carsten Siemens edited Revision 3. Comment: Added tag: en-US

  • Gokan Ozcifci edited Revision 4. Comment: Removed SharePoint Tag  

Page 1 of 1 (4 items)