csomópont.js bemutató Visual Studio Kód

csomópont.a JS egy gyors és skálázható szerveralkalmazások létrehozására szolgáló platform JavaScript használatával. Csomópont.a JS a futásidő, az npm pedig a Node csomagkezelője.js modulok.

Visual Studio Code támogatja a JavaScript és TypeScript nyelvek out-of-the-box, valamint csomópont.js hibakeresés. Azonban egy csomópont futtatásához.js alkalmazás, telepítenie kell a csomópontot.js futási idő a gépen.

az induláshoz ebben walkthrough, install csomópont.js a platform., A csomópont csomagkezelő a csomópontban található.js distribution. Meg kell nyitnia egy új terminált (parancssor) a node és npm parancssori eszközök számára, hogy az elérési úton legyenek.

Linux: vannak konkrét csomópont.js csomagok állnak rendelkezésre a különböző ízek Linux. Lásd: Csomópont Telepítése.js keresztül csomagkezelő, hogy megtalálja a csomópontot.js csomag és telepítési utasítások a Linux verziójához igazítva.

tipp: annak teszteléséhez, hogy van csomópontja.,js helyesen telepítve van a számítógépére, nyisson meg egy új terminált, írja be a node --help parancsot, majd tekintse meg a használati dokumentációt.

Hello World

kezdjük a legegyszerűbb csomópont létrehozásával.js alkalmazás,”Hello World”.

Hozzon létre egy “hello” nevű üres mappát, navigáljon be és nyissa meg a VS kódot:

mkdir hellocd hellocode .

tipp: fájlokat vagy mappákat közvetlenül a parancssorból nyithat meg. Az időszak”.,”az aktuális mappára utal, ezért a VS kód elindul, és megnyitja a Hello mappát.

a File Explorer eszköztárat, nyomjuk meg az Új Fájl gomb:

, majd a fájl nevét app.js:

segítségével a .js fájlok, akkor VS Kód értelmezi ezt a fájlt, mint a JavaScript értékeli a tartalom a JavaScript nyelv szolgáltatás. Tekintse meg a VS Code JavaScript nyelv témát, hogy többet megtudjon a JavaScript támogatásáról.,

Hozzon létre egy egyszerű karakterláncváltozót a app.js – ban, majd küldje el a karakterlánc tartalmát a konzolra:

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

console. IntelliSense a console objektum automatikusan bemutatásra került.

is észre, hogy VS kód tudja, hogy msg egy string alapján az inicializálás 'Hello World'., Ha beírja amsg. parancsot, akkor az IntelliSense megjeleníti amsgkarakterláncfunkciókat.

az IntelliSense kísérletezése után térjen vissza a fenti forráskód példából, majd mentse el a fájlt (⌘S (Windows, Linux Ctrl+S)).

fut Hello World

Ez egyszerű futtatniapp.js A csomópont.js. Egy terminálból csak írja be:

node app.js

látnia kell a” Hello World ” kimenetet a terminálra, majd a csomópontra.,js visszatér.

integrált terminál

VS kód egy integrált terminál, amely segítségével futtatni shell parancsokat. Meg lehet futtatni csomópont.js közvetlenül onnan, és ne kapcsolja ki a VS kód futtatása közben parancssori eszközök.

ehhez a végigjátszáshoz külső terminált vagy a VS Code integrált terminált használhat a parancssori eszközök futtatásához.

hibakeresés Hello World

ahogy a bevezetőben említettük, VS kód hajók egy hibakereső csomópont.js alkalmazások. Próbáljuk hibakeresés egyszerű Hello World alkalmazás.,

aapp.js töréspont beállításához helyezze a szerkesztő kurzort az első sorra, nyomja meg az F9 billentyűt, vagy kattintson a szerkesztő bal oldali csatornájára a sorszámok mellett. Egy piros kör jelenik meg az ereszcsatornában.

a hibakeresés megkezdéséhez válassza ki a Futtatás nézetet a Tevékenységsávban:

most kattintson a hibakeresési eszköztár zöld nyílra, vagy nyomja meg az F5 billentyűt a”Hello World” elindításához. A töréspont lesz hit, és akkor megtekintheti, majd lépjen át az egyszerű alkalmazás., Vegye figyelembe, hogy a VS Code egy másik színes állapotsort jelenít meg, amely jelzi, hogy hibakeresési módban van, majd megjelenik a hibakeresési konzol.

most, hogy látta a VS kódot a” Hello World ” műveletben, a következő szakasz a VS kód használatát mutatja be egy teljes verem csomóponttal.js web app.

Megjegyzés: végeztünk a” Hello World ” példával, így navigáljon ki a mappából, mielőtt létrehozna egy expressz alkalmazást. Törölheti a “Hello” mappát, ha szeretné, mivel ez nem szükséges a végigjátszás többi részéhez.,

egy expressz alkalmazás

Express egy nagyon népszerű alkalmazás keretrendszer az épület és a futó csomópont.js alkalmazások. Akkor állvány (hozzon létre) egy új Express alkalmazás segítségével Express Generator eszköz. Az expressz generátort npm modulként szállítják, és az npm parancssori eszköz segítségével telepítik npm.

tipp: annak teszteléséhez, hogy a npm helyesen van-e telepítve a számítógépére, írja be a npm --help egy terminálról a használati dokumentációt.,

telepítse az expressz generátort úgy, hogy a következőket futtatja egy terminálról:

npm install -g express-generator

a -g switch telepíti az Express generátor globálisan a gépen, így futtatni bárhonnan.

most egy új, myExpressApp nevű expressz alkalmazást állíthatunk fel futással:

express myExpressApp --view pug

Ez létrehoz egy új mappát, amelyet myExpressApp az alkalmazás tartalmával., A--view pug paraméterek azt mondják a generátornak, hogy használja a mopsz sablon motort.

az alkalmazás összes függőségének telepítéséhez (ismét npm modulként szállítva), LÉPJEN az új mappába, és hajtsa végre a npm install:

cd myExpressAppnpm install

Ezen a ponton tesztelni kell, hogy alkalmazásunk fut. A generált Express alkalmazás egypackage.json fájl, amely tartalmaz egy start script futtatni node ./bin/www. Ez elindítja a csomópontot.js alkalmazás fut.,

Az Express application mappában lévő terminálról futtassa:

npm start

a csomópont.a JS webkiszolgáló elindul, majd a http://localhost:3000 menüpontra kattintva megtekintheti a futó alkalmazást.

nagy kódszerkesztés

zárja be a böngészőt és a myExpressApp mappában lévő terminálról állítsa le a csomópontot.js szerver a CTRL+C megnyomásával.,

Most indítsa VS Kód:

code .

Megjegyzés: Ha ön már használja a VS Kód integrált terminál telepítését az Express generátor, bitó, az app, nyissa meg a myExpressApp mappa a futó VS Kód, például a Fájl > Mappa Megnyitása parancsot.

a csomópont.a JS és az Express dokumentációja nagyszerű munkát végez azzal, hogy elmagyarázza, hogyan lehet gazdag alkalmazásokat építeni a platform és a keretrendszer segítségével., Visual Studio kód teszi, hogy több produktív az ilyen típusú alkalmazások fejlesztésében azáltal, hogy nagy kódszerkesztés, navigációs élmények.

nyissa meg a app.js fájlt, majd vigye az egérmutatót a csomópont fölé.js global object __dirname. Figyelje meg, hogy a VS Code megérti, hogy a __dirname egy karakterlánc. Még érdekesebb, hogy teljes IntelliSense lehet A csomópont ellen.js keret. Például a Visual Studio kód beírásakor ahttp parancsra teljes IntelliSense-t kaphat ahttp osztály ellen.,

VS Kódot használ Géppel típus nyilatkozat (typings) fájlokat (például a node.d.ts), hogy olyan metaadatok VS Kód arról, hogy a JavaScript-alapú keretrendszerek vagy fogyasztó a kérelmet. A típus deklarációs fájlok TypeScript-ben vannak írva, így képesek kifejezni a paraméterek és funkciók adattípusait, lehetővé téve a VS kód számára, hogy gazdag IntelliSense élményt nyújtson. A Automatic Type Acquisition nevű funkciónak köszönhetően nem kell aggódnia az ilyen típusú deklarációs fájlok letöltése miatt, a VS Code automatikusan telepíti őket az Ön számára.,

olyan kódot is írhat, amely más fájlokban hivatkozik a modulokra. Például a app.js – ban a ./routes/indexmodult kérjük, amely egy Express.Router osztályt exportál. Ha az IntelliSense-t index – on hozza fel, akkor láthatja a Router osztály alakját.

hibakeresés az Express app

akkor létre kell hoznia egy debugger konfigurációs fájl launch.json az expressz alkalmazás., Kattintson a Futtatás ikonra a Tevékenységsávban, majd a Futtatás nézet tetején található fogaskerék konfigurálása ikonra az alapértelmezett launch.json fájl létrehozásához. Válassza ki a csomópontot.js környezet biztosításával, hogy atype tulajdonságconfigurations van beállítva, hogy. Amikor a fájl először jön létre, VS kód fog kinézni package.json egy start script, és használja ezt az értéket, mint a program (amely ebben az esetben "${workspaceFolder}\\bin\\www) A dob Program konfiguráció.,

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

mentse el az új fájlt, és győződjön meg róla, hogy az indító Program a Futtatás nézet tetején található konfigurációs legördülő menüben van kiválasztva. Nyissa meg a app.js elemet, majd állítsa be a töréspontot annak a fájlnak a teteje közelében, ahol az expressz alkalmazásobjektumot a sorszám bal oldalán található ereszcsatornába kattintva hozza létre. Nyomja meg az F5 gombot az alkalmazás hibakeresésének megkezdéséhez. VS kód indul a szerver egy új terminál, majd nyomja meg a töréspontot állítunk. Innen lehet ellenőrizni változók, hozzon létre órák, majd lépjen át a kódot.,

alkalmazás telepítése

Ha szeretné megtudni, hogyan kell telepíteni a webes alkalmazást, nézze meg az alkalmazások telepítését az az Azure oktatóanyagokba, ahol megmutatjuk, hogyan kell futtatni a webhelyét Azure-ban.

sokkal többet lehet felfedezni a Visual Studio kóddal, kérjük, próbálja ki a következő témákat:

• Beállítások – Ismerje meg, hogyan testreszabhatja a VS kódot a munkához.
• hibakeresés-ez az, ahol a VS kód valóban ragyog.
• videó: az első lépések a Node.js hibakeresés-megtanulják, hogyan kell csatolni egy futó csomópont.js folyamat.
• Node.,js hibakeresés-Tudjon meg többet a VS Code beépített csomópontjáról.js hibakeresés.
• hibakeresési receptek-példák olyan esetekre, mint az ügyféloldali vagy a konténer hibakeresés.
• feladatok – futó feladatok Gulp, Grunt és Jake. Hibák és figyelmeztetések megjelenítése.