Професионална програма
Loading...
nikola.m.nikolov avatar nikola.m.nikolov 830 Точки

Така след като успешно инсталирах node.js за Visual Studio 2013 и аз както повечето колеги останах разочарован, че node.js-а няма читав intelliscene и autocomplete. В крайна сметка успях да стигна до някакъв workaround...

Вместо да създавам Node.js project във Visual Studio си създавам Empty Web Application (Visual C#). По този начин ще ви работи autocomplete и intelliscene за javascript. 

Естествено в задачите за console application няма как резултата да ни го дава в browser-a. Ако сте си инсталирали node.js и node.js extension-a за Visual Studio направете следното: Add Node.js console in Visual Studio. По този начин ако си настроите клавишната комбинация CTRL + J и сте отворили js файла и натиснете клавишната комбинация, то ще видите output-a отдолу във Visual Studio. 

Последният препъни камък е как да debug-ваме?! Аз успях да го излъжа по следния начин. Задължително трябва да си добавите html файл, в който да линкнете js скрипта. Html файла задайте да го отваря с IE. В самият IE отивате на Internet options / Advanced и махате отметките на Disable script debugging (Internet Explorer) и Disable script debugging (Other). В js файла си слагате breakpoint според вашето желание и на html файла давате debug (F5). Ще ви се отвори IE, но не го гледайте (не го и затваряйте!!!). Отивате на js файла във VS и с F10 и F11 си имате Step Over и Step Into. Най-отдолу в Locals таба може да гледате всички променливи как се променят, но там дава и някакви променливи от browser-a. В Watch таба може да си добавите за следене само тези, които ви интересуват. В този момент изниква въпроса а къде може да видим какво принтира на конзолата? Докато сте в Debug режим отивате на Debug / Windows и избирате JavaScript Console. Имайте предвид, че тази конзола не се чисти сама след приключване на debug-a, а вие ръчно трябва да го направите с Clear бутона на конзолата. 

 

Понеже понякога се чупят линковете ще сложа guide-a от форума на Телерик:

1. Изтеглете и инсталирайте NodeJs от тук - http://nodejs.org .

2. Отивате в VS влизате в менюто Tools > External Tools - http://i.imgur.com/SMS8kVy.png

3. Кликате на Add бутона и в полетата отдолу слагате следните неща :
    - В полето Title - Node&Js
    - В полето Command - пътя до node.exe (би трябвало да го знаете, преди 10 секунди го инсталирахте) ако не сте го променяли би трябвало да е C:\Program Files\nodejs\node.exe .
    - В полето Arguments - $(ItemFileName).js
    - В полето Initial directory - $(ItemDir)
    - Чеквате Use Output Window (ако не го чекнете изхода ще се появява в cmd вместо в Output прозореца на VS) и натискате ОК - http://i.imgur.com/6n9dSKD.png

4. Тук е малко странно, ще ни трябва номерчето на tool-a който добавихме, отивате в менюто Tools и почвате да броите менютата които са в една категория с NodeJs (започват от 1) в моя случай е 4, но при вас може да е различно - http://i.imgur.com/cNaJWxC.png

5. Ако искате да добавите бутонче в Tooltip-а на VS, изберете си категория, аз си избрах Build, кликнете на малкото триъгълниче, след това на Add Or Remove Buttons и след това на Costumize...  - http://i.imgur.com/mlJ4FHn.png

След това кликнете на бутона Add Command  - http://i.imgur.com/0UCEZRe.png

След това избирате категория Tools и команда External Command и номерчето на командата което го броихте преди малко. В моя случай External Command 4 . И натискате ОК . - http://i.imgur.com/kLYdVLs.png

Можете да смените мястото на командата с бутоните Move Up и Move Down като преди това кликнете върху самата команда за да я изберете. Аз си я сложих най-накрая.

Ето виждате резултата - http://i.imgur.com/sBXt8aJ.png

6. Ако искате да използвате клавишна комбинация, например Ctrl + J (поне аз си избрах тази) влизате в Tools > Options, от категория Environment избирате менюто Keyboard.

В полето Show commands containing пишете това - tools.ext за да може по-лесно да се намери командата. Избирате Tools.ExternalCommand и номерчето на командата в моя случай Tools.ExternalCommand4. След това от падащото меню Use new shortcut in избирате Text Editor. След това поставяте курсора в полето Press shortcut keys и натискате клавишната комбинация която искате да използвате. В моя случай Ctrl + J, тя трябва да се изпише там, така че можете да видите какво сте натиснали. След това натискате бутона Assing и бутона OK. http://i.imgur.com/z71XybS.png Готово.

Сега когато отворите js файл и натиснете бутона от tooltip-a или клавишната комбинация ще си виждате резултата в Output прозореца на VS. http://i.imgur.com/I0VN3X1.png
3
03/01/2015 10:42:58
aklassanov avatar aklassanov 3 Точки

Здравейте, ако е коректно инсталиран node.js за Visual Studio 2013, то в view >other windows се появява Nodejs Interactive Window който работи като конзола с адекватен autocomplete.

Поздрави

0
10/11/2014 11:31:40
a.angelov avatar a.angelov 1317 Точки

Изключително полезно Никола! Благодаря за описанието smile

Аз досега бях с Express версията на VS и изобщо не се бях опитвал да работя с него, тъй като не могат да му се инсталират plugin-и. Снощи обаче си инсталирах новото VS Community 2013 /което също е безплатно и с функционалност като на Pro версията/ и следвайки тези стъпки успях да настроя и подкарам и аутокъмплийт и дебъг.

Ето сравнение на VS Community с другите версии:

Q: How does Visual Studio Community 2013 compare to other Visual Studio editions? 
A: Visual Studio Community 2013 includes all the great functionality of Visual Studio Professional 2013, designed and optimized for individual developers, students, open source contributors, and small teams.

ПС. Силно се надявам с новата версия 2015, да не се налага да правим всичко това, а нещата да си работят по дифолт...

1
14/11/2014 09:18:28