Node.Js tutorial Visual Studio Code

Node.js on alusta nopeiden ja skaalautuvien palvelinsovellusten rakentamiseen JavaScriptin avulla. Solmu.JS on runtime ja npm on Paketin hallinta solmu.JS-moduulit.

Visual Studio-koodilla on tuki JavaScript-ja TypeScript-kielille sekä node-kielille.JS: n virheenkorjaus. Kuitenkin ajaa solmu.js-sovellus, sinun täytyy asentaa Solmu.js runtime koneessasi.

pääset alkuun tässä läpiviennissä, asenna solmu.JS laiturillesi., Solmupaketin hallinta sisältyy solmuun.JS-Jakelu. Sinun täytyy avata uusi pääte (komentorivi) varten node ja npm komentorivin työkaluja olla oma POLKU.

Linux: On olemassa erityinen Solmu.JS paketteja saatavilla eri makuja Linux. Katso Solmun Asentaminen.JS kautta package manager löytää solmu.JS paketti ja asennusohjeet räätälöity versio Linux.

Vinkki: Voit testata, että sinulla on Solmu.,js oikein asennettu tietokoneeseen, avaa uusi pääte ja kirjoita node --help ja sinun pitäisi nähdä käytön dokumentointi.

Hello World

aloitetaan luomalla yksinkertaisin Solmu.JS-sovellus, ”Hello World”.

Luo tyhjä kansio nimeltä ”hei”, selata ja avata VS-Koodi:

mkdir hellocd hellocode .

Vihje: Voit avata tiedostoja tai kansioita suoraan komentoriviltä. Aika ’.,”viittaa nykyiseen kansioon, joten VS-koodi aloittaa ja avaa Hello – kansion.

File Explorer toolbar, painamalla Uusi Tiedosto-painiketta:

nimeä tiedosto app.js:

käyttäen .js tiedostopääte, VS-Koodi tulkitsee tämän tiedoston, koska JavaScript ja arvioi sisällön kanssa JavaScript-kieli-palvelu. Tutustu VS-koodiin JavaScript language topic saadaksesi lisätietoa JavaScript-tuesta.,

Luo yksinkertainen merkkijono muuttuja app.js ja lähettää sisältöä string konsoliin:

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

Huomaa, että kun kirjoitit console. IntelliSense on console esine oli automaattisesti esittänyt.

Myös huomata, että VS-Koodin tietää, että msg on merkkijono, joka perustuu alustus 'Hello World'., Jos kirjoitat msg. näet IntelliSense näyttää kaikki merkkijonon käytettävissä olevat toiminnot msg.

sen Jälkeen kokeilemalla IntelliSense, palauta mitään ylimääräisiä muutoksia lähdekoodista esimerkiksi edellä ja tallenna tiedosto (⌘S (Windows, Linux Ctrl+S)).

Käynnissä Hello World

Se on helppo ajaa app.js Node.js. Terminaali, kirjoita:

node app.js

Sinun pitäisi nähdä ”Hello World” lähtö terminaalin ja sitten Solmu.,js palaa.

Integroitu Terminaali

VS-Koodi on integroitu terminaali, jolla voit suorittaa shell-komentoja. Voit ajaa Node.js suoraan sieltä ja välttää kytkemistä pois VS-koodista ajettaessa komentorivityökaluja.

tämän läpikäynti, voit käyttää joko ulkoisen päätelaitteen tai VS-Koodi integroitu terminaali käynnissä komentorivin työkaluja.

Debugging Hello World

Kuten johdannossa mainittiin, VS-Koodi alukset debugger Solmu.JS-Sovellukset. Kokeillaan debugging meidän yksinkertainen Hello World sovellus.,

asettaaksesi keskeytyspisteen app.js, laita muokkaimen kursori ensimmäiselle riville ja paina F9 tai napsauta muokkaimessa vasemmalla kourulla rivinumeroiden vieressä. Katuojassa näkyy punainen ympyrä.

aloittaa virheenkorjaus, valitse Run View Activity Bar:

Voit nyt napsauttamalla Debug toolbar vihreää nuolta tai painamalla F5-näppäintä käynnistää ja debug ”Hello World”. Keskeytyspisteesi osuu kohdalle ja voit tarkastella ja astua yksinkertaisen sovelluksen läpi., Huomaa, että VS-Koodi näyttää eri värillinen tilarivi ilmoittaa, että se on Debug-tilassa ja DEBUG-KONSOLI näkyy.

Nyt kun olet nähnyt VS Koodin toiminnan kanssa ”Hello World”, seuraava kohta osoittaa käyttää VS-Koodi, jossa on full-stack-Solmu.JS web app.

Huomautus: Olemme tehneet ”Hello World” esimerkki niin navigoida pois, että kansio ennen kuin luot Express app. Voit poistaa ”Hello” – kansion, jos haluat, koska sitä ei tarvita muun läpivalaisun ajaksi.,

Ilmaista sovellusta

Express on erittäin suosittu sovellus puitteet rakentaa ja käynnissä Solmu.JS-Sovellukset. Voit teline (luoda) uuden Express-sovelluksen Express Generator-työkalulla. Pikageneraattori toimitetaan npm-moduulina ja asennetaan käyttämällä npm-komentorivityökalua npm.

Vinkki: Voit testata, että olet saanut npm oikein asennettu tietokoneeseen, kirjoita npm --help terminaali, ja sinun pitäisi nähdä käytön dokumentointi.,

Asenna Ilmaista Generaattori suorittamalla seuraavat terminaali:

npm install -g express-generator

-g kytkin asentaa Express Generaattori maailmanlaajuisesti koneellasi, joten voit käyttää sitä mistä tahansa.

nyt Voimme teline uusi Express sovellus nimeltä myExpressApp käynnissä:

express myExpressApp --view pug

Tämä luo uusi kansio nimeltä myExpressApp sisällön kanssa hakemuksesi., --view pug parametrit käskevät generaattoria käyttämään pug-mallimoottoria.

asenna kaikki sovelluksen riippuvuudet (jälleen lähetetty npm moduulit), siirry uuden kansion ja suorittaa npm install:

cd myExpressAppnpm install

tässä vaiheessa, meidän pitäisi testata, että sovellus toimii. Syntyy Express sovellus on package.json tiedosto, joka sisältää start skripti ajaa node ./bin/www. Tämä käynnistää solmun.JS-sovellus käynnissä.,

terminaali, Express sovelluksen kansioon, suorita:

npm start

– Solmu.js web-palvelin käynnistyy ja voit selata http://localhost:3000 nähdä käynnissä olevan sovelluksen.

Suuri-koodin muokkaus

Sulje selain ja pääte – myExpressApp kansioon, lopeta Solmu.JS-palvelin painamalla CTRL + C.,

Nyt käynnistää VS-Koodi:

code .

Huomautus: Jos olet käyttänyt VS Koodi integroitu terminaali asentaa Express generaattori ja telineen app, voit avata myExpressApp kansio käynnissä VS Koodi esimerkiksi Tiedosto > Avaa Kansio-komentoa.

– Solmu.js ja Express dokumentaatio tekee hienoa työtä selittää, miten rakentaa rikas sovelluksia käyttämällä Alustan ja puitteet., Visual Studio koodi tekee sinusta tuottavampia kehittää tämäntyyppisiä sovelluksia tarjoamalla suuri koodin muokkaus ja navigointi kokemuksia.

Avaa tiedoston app.js ja osoitin Solmuun.js global object __dirname. Huomaa, miten VS-Koodi ymmärtää, että __dirname on merkkijono. Vielä mielenkiintoisempaa on saada täysi IntelliSense solmua vastaan.js framework. Esimerkiksi, voit vaatia http ja saada täyden IntelliSense vastaan http luokkaa kuin kirjoitat Visual Studio Koodi.,

VS-Koodi käyttää Kirjoituskoneella tyyppi ilmoitus (typings) – tiedostoja (esimerkiksi node.d.ts) antaa metatiedot VS Koodi siitä, JavaScript perustuu kehyksiin olet vievää teidän sovellus. Tyyppi ilmoitus tiedostot on kirjoitettu Kirjoituskoneella, jotta he voivat ilmaista tiedot tyypit, parametrit ja toiminnot, joiden avulla VS Koodi tarjota rikas IntelliSense kokemus. Kiitos ominaisuus nimeltä Automatic Type Acquisition sinun ei tarvitse huolehtia ladata nämä tyyppi ilmoitus-tiedostoja, VS-Koodi tulee asentaa ne automaattisesti.,

voit myös kirjoittaa koodia, joka viittaa moduuleihin muissa tiedostoissa. Esimerkiksi app.js edellytämme ./routes/index – moduuli, joka vie Express.Router luokka. Jos tuo IntelliSense on index, voit nähdä muoto Router luokka.

Debug Express app

Sinun täytyy luoda debuggeri configuration file launch.json oman Express sovellus., Napsauta käynnistä-kuvaketta Toiminta Baarissa ja sitten Määritä vaihde kuvaketta yläreunassa Ajaa näkymä luo oletusarvoisesti launch.json tiedosto. Valitse solmu.js ympäristössä, varmistamalla, että type kiinteistön configurations on asetettu "node". Kun tiedosto on ensin luotu, VS-Koodi näyttää package.json ja start script ja käyttää tätä arvoa kuin program (joka on tässä tapauksessa "${workspaceFolder}\\bin\\www) Käynnistää Ohjelman asetuksia.,

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

Tallenna uusi tiedosto ja varmista, Käynnistää Ohjelma on valittuna konfigurointi avattavasta yläreunassa Ajaa näkymä. Avaa app.js ja asettaa breakpoint yläosassa tiedoston, jossa Express app objekti luodaan valitsemalla katuojaan vasemmalla puolella olevan rivin numero. Paina F5 aloittaa virheenkorjaus sovellus. VS-koodi käynnistää palvelimen uudessa terminaalissa ja osuu asettamaamme keskeytyspisteeseen. Sieltä voit tarkastaa muuttujia, luoda kelloja ja astua koodin läpi.,

ottaa Käyttöön hakemuksesi

Jos haluat oppia miten asentaa web-sovellus, tutustu Käyttöön Sovelluksia windows Azure tutorials jossa näytämme miten ajaa verkkosivuilla windows Azure.

Siellä on paljon enemmän tutkittavaa, kuten Visual Studio Koodi, kokeile seuraavia aiheita:

• Asetukset – Oppia, miten muokata VS-Koodi, miten haluat työskennellä.
• Debugging – This is where VS Code really shines.
• Video: aloitus solmulla.JS virheenkorjaus-Opi kiinnittämään käynnissä solmu.JS-prosessi.
• Node.,JS debugging-Lue lisää VS-koodin sisäänrakennetusta solmusta.JS: n virheenkorjaus.
• Vianetsintäreseptejä-esimerkkejä skenaarioista, kuten asiakaspuolen ja kontin virheenkorjaus.
• tehtävät – Juoksutehtävät Gulpin, Gruntin ja Jaken kanssa. Näytetään virheitä ja varoituksia.