node.js - NG Live utviklingsserver vs Tradisjonell webserver

Jeg er ny på Angular2. Jeg har begynt å lære gjennom ressurser på Internett.

Jeg bruker Angular-Cli-verktøy for å bygge testapplikasjonen min.

Når jeg gir kommandoen ng serve --open får jeg mitt eksempelprosjekt til å kjøre på standardport 4200, og konsollen viser,

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200 **

Nå er jeg veldig forvirret med NG Live Development Server.

Jeg har følgende bekymringer,

  • Som et klient-side rammeverk, hvorfor trenger Angular en utviklingsserver.

  • Hvor Live Server fysisk er plassert på den kjørende maskinen

  • Live-serveren kan bare tjene Javascript eller et annet språk.
  • Hva er kompleksiteten ved å integrere en Angular2-applikasjon med serverside-rammeverk som Spring-MVC.

Kan noen vennligst dele sine tanker om dette? Vennligst korriger meg hvis jeg har forstått konseptene feil.

Svar #1

Tl;Dr CLI-live-serveren er kun for lokal utvikling. Ikke for produksjon eller noe miljø annet enn lokal utvikling.

For å svare på dine spesifikke spørsmål:

Som et klient-side rammeverk, hvorfor trenger Angular en utviklingsserver.

Angular er et SPA-rammeverk. Den kompilerte applikasjonskoden må lastes inn i nettleseren fra en webserver.

Hvor Live Server fysisk er plassert på den kjørende maskinen

Serveren er en del av Webpack, som er en avhengighet av Angular-CLI. Så den ligger i node_modules-mappen din.

Live-serveren kan bare tjene Javascript eller et annet språk.

Utviklingsserveren er bare for å kjøre Angular-koden din på din lokale utviklingsmaskin. Hvis du har en API-backend, bør du se på å videresende forespørsler gjennom utviklingsserveren til din utviklings-API.

Hva er kompleksiteten ved å integrere en Angular2-applikasjon med serverside-rammeverk som Spring-MVC.

Dette er trivielt. Du vil ikke være vert for Angular-applikasjonen din i produksjon på den levende utviklingsserveren. I stedet vil du kjøre ng build --prod --aot for å bygge produksjonsbuntene inn i prosjektets dist-mappe. Dette er byggeartefaktene som vil bli distribuert til frontend-nettserveren din. Konfigurer frontend til å kjøre i rotkonteksten, dvs. www.foo.com/, og Spring APIen til å kjøre i /api-konteksten www.foo.com/api/.

Svar #2

Du vil kanskje ta en titt på dette:

Node live-server

Dette forklarer tydelig hva en live-server faktisk er, og også hvordan den fungerer: Sitat fra lenken:

Serveren er en enkel Node-app som betjener arbeidskatalogen og dens underkataloger. Den overvåker også filene for endringer, og når det skjer, sender den en melding gjennom en web socket-forbindelse til nettleseren som instruerer den om å laste siden på nytt. For at klienten skal støtte dette, injiserer serveren et lite stykke JavaScript-kode i hver forespurte HTML-fil. Dette skriptet etablerer web socket-forbindelsen og lytter til forespørslene om å laste på nytt. CSS-filer kan oppdateres uten å laste hele siden på nytt ved å finne de refererte stilarkene fra DOM og lure nettleseren til å hente og analysere dem igjen.

Hvis du går gjennom hele innlegget, vil du få svar på nesten alle spørsmålene dine.

Relaterte artikler