SharePoint hosted add-in intellisense not working for SP namespace

Question

I have a _references.js file in my scripts folder which references the following files:

/// <reference path="~/_layouts/15/MicrosoftAjax.js" />
/// <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” /> 

But intellisense for the SP namespace never works.

Where are those files supposed to be located? I'm not sure where ~/_layouts points to.

I've checked this location:

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\  

I have folders 15 and 16 in there but there are no JS files in either of their Template/Layouts folders.

I'm working on Windows 10, Visual Studio 2015 Update 3 and developing for SharePoint Online

How do I get Intellisense working?

Answer 1

For SharePoint Online we are most likely not developing on a machine with SharePoint installed so C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\ will not contain the required files, below is the only way I have found to develop with intellisense for SharePoint Online.

Download each of the required below files from the SharePoint Online site:

Url location:

https://<sharepoint online site url>/_layouts/15/<filename>

filenames:

init.js
sp.js
sp.core.js
sp.debug.js
sp.runtime.js

There are other optional files which you may require, download as necessary (ie. SP.UI.Dialog.js)

Then I added them into my project (I put them in a seperate folder for cleanliness) then I added a link to them in my _references.js file.

/// <reference path="../SharePointReferences/init.js" />
/// <reference path="../SharePointReferences/sp.js" />
/// <reference path="../SharePointReferences/sp.core.js" />
/// <reference path="../SharePointReferences/sp.runtime.js" />
/// <reference path="../SharePointReferences/sp.UI.Dialog.js" />
/// <reference path="../SharePointReferences/sp.debug.js" />

Set the files "Deployment Type" to "NoDeployment" as they exist on the server so we dont directly reference them.

Set up the _references.js file

You will need to also make sure that you have your _references.js file set up in VS properly, mine wasn't initially.

Go to Tools > Options > Text Editor > Javascript > Intellisense > References

Reference Group = Implicit (Web)

Add > "~/Scripts/_references.js"

Now you should get intellisense in your SharePoint Add In project.

TypeScript

The other option is to use TypeScript which has a TS definition file.