ExtJS in Visual Studio (2010) - visual-studio

Two questions:
How can I get JavaScript IntelliSense for ExtJS?
Are there any good tools (e.g. Extensions, NuGet packages) for working with ExtJS in Visual Studio?
Are there any good tools (e.g. Add-on Extensions like FireBug) for working with ExtJS in Firefox?

To use intellisense in VS 2010 you need to reffer which files should be loaded for intelli sense. You can archive this with references in the docs where you want to use intelli sense:
/// <reference path="ScriptFile1.js" />
/// <reference path="Scripts/ScriptFile2.js" />
/// <reference path="../ScriptFile3.js" />
/// <reference path="~/Scripts/ScriptFile4.js" />
for more information on intellisense take a look at the MSDN
For the tools part;
Edit
To Update on highlighting, braces, aso :
Javascript tools is a great package directly by Microsoft
editend
Javasript Parser does a great work for me when writing
For testing & Debugging Firebug is the best you get in my opinion, but you can also use the IE developer tools(install only required for older IE, prior 8 if I am not mistaking) for debugging.

I have found these extensions useful when working with ExtJS in Visual Studio:
Javascript Parser - makes it easy to find functions, shows todo comments
JSLint.VS2010 - code analysis, helps avoid coding mistakes

try this http://www.dxdframework.com/, it's ext 3 integrated with msvs2010, examples are still for msvs2008, but as i know documentation will be updated soon. wiki: http://wiki.dxdframework.com/AllPages.aspx

To answer point #2, I highly recommend Ext.Net for working with ExtJS in Visual Studio, assuming you are using ASP.NET.

Best resources for wiring up IntelliSense for EXTJS in VS 2010+ is here:
http://gurustop.net/blog/2012/03/03/javascript-js-intellisense-auto_complete-in-visual-studio-11-beta-the-web-_references-js-file/
Note the "Updated" comment at the bottom:
"...you can add files to the global JavaScript intellisense from the Visual Studio Tools –> Options Dialog."
This worked for me after I added "ext-all-debug-w-comments.js" to the list and turned off Resharper's IntelliSense for JS files only.

Related

In Visual Studio 2012, I get warnings and squiggly lines when trying to write JSX with React JS

I am using a separate javascript file to put my React JS JSX in. When I use the example given by the documents, I get tons of Visual Studio warnings and ugly squiggly lines..
I cannot figure out a way around this.. Pretty much a deal breaker for React JS.
Visual Studio 2012 was released before ReactJs, so you can't really blame them for not supporting it.
There is some visual studio stuff here:
http://reactjs.net/
You can see support for tooling being asked here:
https://github.com/reactjs/React.NET/issues/3
with Web Essentials being one of the prime picks for asking for support (might want to add your votes!)
If you are using Resharper it might be added in the next release, JetBrains is looking to add it into WebStorm
https://youtrack.jetbrains.com/issue/WEB-10136
This is because you're essentially putting html into your javascript. I found this after a quick google search and might fix your problem: https://visualstudiogallery.msdn.microsoft.com/d65d6b29-6dd7-4100-81b1-609e5afce356
The page mentions: "Visual Studio currently doesn't have native JSX syntax support. You can edit .jsx files in regular VS JavaScript editor for now and vote for adding native JSX support in Visual Studio here (the most requested feature in WE)."

Is it possible to generate comments for TypeScript methods/classes in Visual Studio?

Is there a way to generate JSDoc comments in Visual Studio like XML comments in C#? I.g. by typing ///? There is a plugin for JavaScript. Is there something simular for TypeScript, yet?
No. There isn't anything for TypeScript yet.
You could request it as a feature either from the TypeScript Visual Studio extension, Web Essentials or write a Visual Studio extension and stick it in the library.
I've updated my extension to support JSDoc and VSDoc in both JavaScript and TypeScript for Visual Studio 2012+.
https://visualstudiogallery.msdn.microsoft.com/0cb7304b-ad78-4283-ba2b-42804657fcdd?SRC=VSIDE
DocStubsJs [Formerly known as JavaScript vsdoc Generator]
This extension's goal is to provide a simple way to add documentation
to JavaScript and TypeScript by adding comment stubs after typing in
the opening of a new documentation comment.
To make this seem like less of a shameless plug, Atomineer also supports this, though it's a paid extension (it does a lot more than just a simple stub, though)
https://visualstudiogallery.msdn.microsoft.com/7912CCF4-60B8-4132-BACE-5ACACEB7233B

How do I get JavaScript Intellisense from vsdoc file references in WebMatrix 2 Beta?

I copied a JavaScript file over from Visual Studio to a new WebMatrix 2 Beta project only to find out the vsdoc file wasn't being used for JavaScript Intellisense.
/// <reference path="jquery-1.6.4-vsdoc.js" />
JavaScript's core functions do show up in Intellisense, but it doesn't appear to pull additional data from vsdoc files.
Spoiler alert: I will be answering this myself to bring the answer from its current webmatrix.uservoice.com location to StackOverflow for anyone else with this issue. Please don't take offense to this.
Since they are currently taking user input on desired features in WebMatrix 2 Beta, I pitched support for vsdoc JavaScript file references. The WebMatrix team responded that it was already supported but the syntax was different until they change it to be more consistent with the current Visual Studio syntax. It is only different by one word.
Works in WebMatrix 2 Beta (note "file" instead of "path")
/// <reference file="jquery-1.6.4-vsdoc.js" />
Note:
While the "path" syntax doesn't work in WebMatrix 2 Beta yet, the WebMatrix team seemed intent on supporting it going forward for consistency with Visual Studio. If, for some reason, someone is using the same *vsdoc.js file between a WebMatrix 2 Beta project and a Visual Studio project (or managing a a WebMatrix user's project in Visual Studio), you could simply cover both bases. The WebMatrix "file" syntax does not appear to be supported by Visual Studio 2010.
/// <reference path="jquery-1.6.4-vsdoc.js" />
/// <reference file="jquery-1.6.4-vsdoc.js" />
Additional Note:
WebMatrix 2 Beta does not appear to support the new paragraph-sectioned (<para>) vsdoc files.

Prototype / Scriptaculous intellisense in Visual Studio

How do I get intellisense for Prototype / Scriptaculous like we get for jQuery in Visual Studio?
It's certainly not perfect, but you can get a little bit by adding
/// <reference path="path/to/prototype.js" />
to the top of your JavaScript files. Actually, if you have a JS file open in Visual Studio and you drag the prototype.js file into your open file, it will automatically add that reference for you.
This will give you very poor IntelliSense support, but perhaps it is better than nothing.
I might be wrong but I really doubt there is any for now.
For now, either you write your own and share with the world or wait for someone to create them.
PS: jQuery intellisense support was released as a hotfix for VS.NET. It makes sense as jQuery is sort of 'endorsed' by the MS guys. Chances for them to release similar support for other JS framework is unlikely I'll say.

Is it possible to add HTML5 validation to Visual Studio?

I'm working on a page using <canvas>, which is a HTML5 tag, in Visual Web Developer Express Edition 2008, and the validator in the HTML editor is telling me it's an invalid tag. That's because it's set to validate against XHTML 1.0 Transitional. I'd prefer for it to not do that and tell me what's valid or invalid based on the HTML5 doctype, but I can't find anywhere in the preferences that suggests this would be possible.
Is there a way to tell Visual Studio to validate against HTML5, or add a new spec reference manually? I'd prefer not to have to go in and add tags manually, which appears to be the only option at the moment.
It looks like the Visual Web Developer team solved the problem by adding HTML5 support themselves:
http://blogs.msdn.com/webdevtools/archive/2009/11/18/html-5-intellisense-and-validation-schema-for-visual-studio-2008-and-visual-web-developer.aspx
You all probably know that new HTML 5 standard is coming. We made a new intellisense schema that you can add to VS 2008 or VWD Express 2008 and get intellisense and validation on HTML 5 elements.
For Visual Studio 2010 you'll want to install the Web Standards Update for Visual Studio 2010 SP1:
It updates the HTML5 intellisense and validation to reflect the latest
W3C specifications and fixes some bugs bugs in the current SP1 support
for HTML5. Also JavaScript intellisense it updated to reflect many of
the new browser capabilities such as Geolocation and DOM storage.
Finally, this update adds comprehensive CSS3 intellisense and
validation based on the latest specifications from W3C.
For Visual Studio 2008, Microsoft has provided an updated version of the HTML 5 validation schema and intellisense in the Visual Studio Gallery.
HTML 5 Intellisense
The updated schema was posted by Mikhail Arkhipov, the same Microsoft employee who wrote the blog post linked in Rahul's answer.
I created a validation schema that you're free to use:
http://johndyer.name/post/2009/07/21/HTML5-XHTML5-Validation-Schema-for-Visual-Studio-2008.aspx
This is now included in Visual Studio 2010 SP1
You can define your own validation standards.
You need to add the file to the folder in VS install, and add to the registry.
This is the description I used (HTML and CSS have a very similar approach): http://blogs.msdn.com/mikhailarkhipov/archive/2007/10/19/how-to-create-custom-css-intellisense-schema-in-visual-studio-2005-and-2008.aspx

Resources