Nastavite spletno aplikacijo Nuxt.js na Ubuntu 18.04 LTS

Nuxt.js: Univerzalni okvir

Nuxt.js je okvir JavaScript, zasnovan za hitro ustvarjanje univerzalnih aplikacij Vue.js. Najbolj znan je po svoji sposobnosti ustvarjanja aplikacij Vue.js, ki jih je mogoče upodabljati na strežniku in odjemalcu. V tej vadnici bomo postavili strežniško upodobljeno aplikacijo Nuxt.js in jo namestili v Ubuntu 18.04 LTS.

Namestitev Node.js

Najprej se boste morali prepričati, da uporabljate Ubuntu 18.04 LTS. Nato boste morali namestiti Node.js, če še ni nameščen. V tej vadnici bomo uporabili upravljalnik različic vozlišč ali NVM, da bo ta proces veliko lažji.

Namestite NVM z naslednjimi ukazi.

curl -sL https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh -o install_nvm.sh
bash install_nvm.sh
source ~/.profile
nvm install 11.1.0
nvm use 11.1.0

Aplikacija odra

Ko imate nameščen Node.js, lahko zdaj nadaljujemo z nastavitvijo paketov, ki jih bomo potrebovali z uporabo NPM. create-nuxt-appUporabili bomo priročno malo orodje, imenovano , orodje skupnosti, ki lahko preprosto ustvari aplikacije Nuxt.js.

V domačem imeniku zaženite naslednji ukaz, da začnete ustvarjati aplikacijo.

npx create-nuxt-app <nameofproject>

Konzola vas bo pozvala k več pomembnim možnostim. Zaradi te vadnice bomo naš projekt poimenovali " app". Kot okvir strežnika po meri bomo uporabili Express, aplikacijo pa bomo zagnali v univerzalnem načinu, ki zagotavlja, da bomo naše spletno mesto upodabljali na strežniku. Ko podate vsa zahtevana dovoljenja, se bo začel postopek namestitve in ustvarjene bodo vse konfiguracijske datoteke.

Začetni zagon

Ko je vse preneseno, spremenite imenike v mapo, ki ste jo pravkar ustvarili.

cd app

Zdaj lahko zaženemo razvojni strežnik Nuxt.js.

npm run dev

Ta ukaz bo zgradil spletno mesto z uporabo spletnega paketa, ki je povezovalnik modulov, in bo spletno mesto serviral na pristaniščih lokalnega gostitelja, ki bodo običajno port 3000. Omogočil vam bo tudi dostop do modulov za vročo ponovno nalaganje, kar bo odstranilo potrebo po ponovnem zagonu aplikacije vsakič, ko spremenite datoteko. Ker aplikacijo izvajamo v univerzalnem načinu, bo aplikacija prevedena tako na odjemalcu kot na strežniku. Zdaj se bo vaša aplikacija izvajala na vratih 3000.

Zgradba za proizvodnjo

Razvojni način je zelo uporaben, ko aktivno razvijate svojo aplikacijo. Ko pa ste pripravljeni objaviti svojo aplikacijo, postanejo dodatki, kot so vroče ponovno nalaganje in orodja za razvijalce, manj pomembni. Zato bomo želeli našo aplikacijo zgraditi enkrat, za produkcijsko okolje. Na srečo Nuxt.js vključuje orodje, ki ga lahko uporabimo za hitro izdelavo modulov naše aplikacije za proizvodnjo. Zaženite naslednje, da začnete postopek izdelave proizvodnje.

npm run build

V bistvu to, kar počnemo tukaj, je, da sestavljamo vse naše module spletnega paketa z optimizacijami za produkcijo.

Ko bo gradnja končana, boste lahko zagnali spletno mesto za proizvodnjo.

npm start

Zdaj, če se pomaknete do http://yourip:3000, boste videli uvodni zaslon Nuxt.js, ki potrjuje, da delujete v produkcijskem načinu.

PM2: z lahkoto upravljajte svojo aplikacijo

Zdaj razumemo osnove izvajanja naše aplikacije za proizvodnjo. V smislu produkcijskega okolja bi raje imeli dober način, da naša aplikacija deluje večno, samodejno znova zažene našo aplikacijo, kadar je to potrebno, in spremlja vire naše aplikacije. Tu pride na vrsto Process Manager 2 (PM2). PM2 je upravljalnik procesov Node.js za produkcijske aplikacije, ki vključuje številna pomembna produkcijska orodja, kot so uravnoteženje obremenitve, napredni dnevniki, zagonski skripti in še veliko več. Najprej namestite PM2.

npm install pm2 -g

S tem se PM2 namesti globalno, tako da ga lahko uporabljamo kjer koli na našem strežniku. Ko je PM2 končan s prenosom, lahko zaženemo našo aplikacijo.

pm2 start <appfolder>/server/index.js

Upoštevajte, da zaženemo strežniško datoteko, ki se nahaja znotraj korena naše aplikacije.

Če si želite ogledati vire, ki jih porabi vaša aplikacija, lahko to storite z pm2 monitukazom. To bo odprlo vmesnik, podoben vmesniku ncurses, kjer lahko natančno zbirate podatke o uporabi RAM-a, CPU-ja in diska vaše aplikacije.

Do zdaj bo vaša aplikacija delovala točno tako, kot je bila, ko smo jo izvajali z npm prej, le da imamo zdaj veliko več nadzora, ko gre za optimizacijo produkcije.

Zdaj imate različico aplikacije Nuxt.js, ki je nameščena za proizvodnjo z Node.js in Ubuntu 18.04. Če želite izvedeti več o Nuxtu in vseh njegovih poglobljenih funkcijah, obiščite njihovo uradno dokumentacijo .