nod.Js tutorial În Visual Studio Code

nod.Js tutorial În Visual Studio Code

nod.js este o platformă pentru construirea de aplicații server rapide și scalabile folosind JavaScript. Nod.js este runtime și npm este managerul de pachete pentru nod.module js.Visual Studio Code are suport pentru JavaScript și TypeScript limbi out-of-the-box, precum și nod.JS depanare. Cu toate acestea, pentru a rula un nod.aplicație js, va trebui să instalați nodul.JS runtime pe mașină.

pentru a începe în acest walkthrough, instalați Node.js pentru platforma., Managerul de pachete de noduri este inclus în nod.JS distribuție. Veți avea nevoie pentru a deschide un nou terminal (command prompt) pentru node și npm instrumente de linie de comandă pentru a fi pe CALEA ta.

Linux: există nod specifice.pachete js disponibile pentru diferite arome de Linux. A Se Vedea Instalarea Nod.JS prin managerul de pachete pentru a găsi nodul.pachet js și instrucțiuni de instalare adaptate la versiunea dvs. de Linux.

Sfat: Pentru a testa că ai Nod.,JS instalat corect pe computer, deschideți un terminal nou și tastați node --help și ar trebui să vedeți documentația de utilizare.

Hello World

Să începem prin crearea celui mai simplu nod.aplicație js, „Hello World”.

Creați un folder gol numit „hello”, navigat si deschide VS Cod:

mkdir hellocd hellocode .

Indicație: puteți deschide fișiere sau foldere direct din linia de comandă. Perioada”.,’se referă la dosarul curent, prin urmare, codul VS va începe și va deschide folderul Hello.

Din Fișier Explorer bara de instrumente, apăsați butonul de Fișier Nou:

și numele fișierului app.js:

Cu ajutorul .js extensia de fișier, VS Cod interpretează acest fișier JavaScript și va evalua conținutul cu limbajul JavaScript serviciu. Consultați subiectul VS cod JavaScript language pentru a afla mai multe despre suportul JavaScript.,

de a Crea un simplu șir de variabile din app.js și trimite conținutul șir de caractere la consola:

var msg = 'Hello World';console.log(msg);

Rețineți că, atunci când tastat console. IntelliSense pe console obiect a fost automat prezentate la tine.

de Asemenea, observați că VS Cod știe că msg este un șir de caractere pe baza de inițializare a 'Hello World'., Dacă tastați msg. veți vedea IntelliSense arată toate șir de funcții disponibile pe msg.

după experimentarea cu IntelliSense, reveniți la orice modificări suplimentare din exemplul de cod sursă de mai sus și salvați fișierul (⌘S (Windows, Linux Ctrl+S)).

rularea Hello World

este simplu pentru a rula app.js cu nod.J. S. De la un terminal, tastați:

node app.js

ar trebui să vedeți „Hello World” ieșire la terminal și apoi Nod.,JS se întoarce.

Terminal integrat

VS cod are un terminal integrat pe care îl puteți utiliza pentru a rula comenzi shell. Puteți rula nod.js direct de acolo și pentru a evita trecerea de cod VS în timp ce rulează instrumente de linie de comandă.

pentru acest pas, puteți utiliza fie un terminal extern, fie terminalul integrat de cod VS pentru rularea instrumentelor din linia de comandă.

Debugging Hello World

după cum sa menționat în introducere, VS nave de cod cu un debugger pentru nod.aplicații js. Să încercăm să depanăm aplicația noastră simplă Hello World.,

pentru a seta un punct de întrerupere în app.js, puneți cursorul editorului pe prima linie și apăsați F9 sau faceți clic în jgheabul din stânga editorului de lângă numerele liniei. Un cerc roșu va apărea în jgheab.pentru a începe depanarea, selectați vizualizarea Run din bara de activități:

acum Puteți face clic pe Debug toolbar green arrow sau apăsați F5 pentru a lansa și depana”Hello World”. Breakpoint dvs. va fi lovit și puteți vizualiza și pas prin simpla aplicație., Observați că codul VS afișează o bară de stare colorată diferită pentru a indica faptul că este în modul de depanare și este afișată consola de depanare.

acum că ați văzut codul VS în acțiune cu „Hello World”, următoarea secțiune arată folosind codul VS cu un nod full-stack.aplicație web js.

notă: am terminat cu exemplul „Hello World”, astfel încât să navigați din acel folder înainte de a crea o aplicație expresă. Puteți șterge folderul „Hello” dacă doriți, deoarece nu este necesar pentru restul walkthrough-ului.,

o aplicație expresă

Express este un cadru de aplicare foarte popular pentru construirea și rularea nod.aplicații js. Puteți schela (crea) o nouă aplicație expres folosind Instrumentul Generator Express. Generatorul Expres este livrat ca un modul npm și instalat utilizând instrumentul de linie de comandă npm npm.

Sfat: Pentru a testa că ai npm corect instalat pe computer, tastați npm --help de la un terminal și ar trebui să consultați documentația de utilizare.,

Instalare Express Generator de funcționare următoarele de la un terminal:

npm install -g express-generator

-g comutator instalează Express Generator la nivel global pe mașina dvs., astfel încât să puteți rula de oriunde.

acum putem schele un nou Expres aplicație numită myExpressApp de funcționare:

express myExpressApp --view pug

Acest lucru creează un nou folder numit myExpressApp cu conținutul de aplicația dumneavoastră., Parametrii --view pug spun generatorului să utilizeze motorul șablon pug.

Pentru a instala toate cererii dependențe (din nou, livrat ca npm module), du-te la folder nou si executa npm install:

cd myExpressAppnpm install

În acest punct, ar trebui să testați că cererea noastră execută. Generate Express aplicație are un package.json fișier care include un start script pentru a rula node ./bin/www. Aceasta va porni nodul.JS aplicație care rulează.,

De la un terminal la cerere Expresă dosar, executați:

npm start

Nodul.js web server va începe și puteți naviga la http://localhost:3000 pentru a vedea aplicația care rulează.

Mare cod de editare

Închideți browser-ul și de la un terminal în myExpressApp folder, opri Nod.server js apăsând CTRL + C.,

Acum lansare VS Cod:

code .

Notă: Dacă ați fost utilizați VS Cod integrat terminal pentru a instala Express generator și schela app, puteți deschide myExpressApp folder de funcționare VS Cod instanță cu Dosarul > deschidere Dosar de comandă.

nodul.JS și Express documentation face o treabă excelentă explicând cum să construiți aplicații bogate folosind platforma și Cadrul., Visual Studio Code vă va face mai productiv în dezvoltarea acestor tipuri de aplicații prin furnizarea de editare Cod mare și experiențe de navigare.

deschideți fișierul app.js și treceți peste nod.js obiect global __dirname. Observați cum Codul VS înțelege că __dirname este un șir. Chiar mai interesant, puteți obține IntelliSense complet împotriva nodului.cadru js. De exemplu, puteți solicita http și obțineți IntelliSense completă împotriva clasei http pe măsură ce tastați codul Visual Studio.,

VS Cod folosește mașina de Scris tip de declarație (typings) fișiere (de exemplu node.d.ts) pentru a furniza metadatele VS Cod JavaScript bazat pe cadre se consuma în cererea dumneavoastră. Fișierele declarație de tip sunt scrise în TypeScript astfel încât acestea să poată exprima tipurile de date de parametri și funcții, permițând Cod VS Pentru a oferi o experiență bogată IntelliSense. Datorită unei funcții numite Automatic Type Acquisition, nu trebuie să vă faceți griji cu privire la descărcarea acestor fișiere de tip declarație, VS Code le va instala automat pentru dvs.,de asemenea, puteți scrie cod care face referire la module în alte fișiere. De exemplu, în app.js avem nevoie de ./routes/index module, care exportă un Express.Router clasa. Dacă aduceți IntelliSense pe index, puteți vedea forma clasei Router.

Debug Express app

Veți avea nevoie pentru a crea un depanator fișier de configurare launch.json pentru a Exprima cererea., Faceți clic pe pictograma Run din bara de activități și apoi pe pictograma Configure gear din partea de sus a vizualizării Run pentru a crea un fișier implicit launch.json. Selectați nodul.js mediu, asigurându-se că type proprietăți în configurations este setat la "node". Atunci când fișierul este creat pentru prima dată, VS Cod va arata in package.json un start script și va folosi această valoare ca program (care în acest caz este "${workspaceFolder}\\bin\\www) pentru a Lansa Programul de configurare.,

{ "version": "0.2.0", "configurations": }

Salvați fișierul nou și asigurați-vă că Programul de Lansare este selectată în meniul drop-down de configurare în partea de sus a Rula vedere. Deschideți app.js și setați un punct de întrerupere în partea de sus a fișierului în care este creat obiectul Express app făcând clic pe jgheabul din stânga numărului liniei. Apăsați F5 pentru a începe depanarea aplicației. Codul VS va porni serverul într-un terminal nou și va lovi punctul de întrerupere pe care l-am setat. De acolo puteți inspecta variabile, crea ceasuri, și pas prin codul.,

Implementa aplicația

Dacă doriți să aflați cum să implementați aplicația web, a verifica Implementarea Aplicațiilor la Azure tutoriale unde vă vom arăta cum de a rula site-ul dvs. în Azure.

există mult mai multe pentru a explora cu Visual Studio Code, vă rugăm să încercați următoarele subiecte:

  • Setări – Aflați cum să personalizați VS cod pentru modul în care vă place să lucrați.
  • Debugging-acest lucru este în cazul în care codul VS într-adevăr strălucește.
  • Video: Noțiuni de bază cu Node.JS debugging-Aflați cum să atașați la un nod care rulează.procesul js.
  • nod.,JS debugging-Aflați mai multe despre nodul încorporat VS Cod.JS depanare.
  • Debugging recipes-Exemple de scenarii, cum ar fi client-side și container de depanare.
  • SARCINI-rularea sarcinilor cu Gulp, Grunt și Jake. Se afișează erori și avertismente.

Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *