Produkcijsko okolje serije Angular 11 (XIV) za odpravljanje napak

Mala drhal · Objavljeno na 11. 08. 2020 17:59:35

Angular 9 serija (1) Dinamično obremenjene komponente
https://www.itsvse.com/thread-9238-1-1.html

Dinamični parametri prenosa komponent serije Angular 9 (2)
https://www.itsvse.com/thread-9245-1-1.html

Serija Angular 9 (3) podpira dinamične dogodke komponent
https://www.itsvse.com/thread-9246-1-1.html

Angular 9 Series (IV) cevovodi po meri
https://www.itsvse.com/thread-9248-1-1.html

Angular 9 Series (V) formatira format valute
https://www.itsvse.com/thread-9249-1-1.html

Angular 9 serija (VI) kliče nativne JS spremenljivke in metode
https://www.itsvse.com/thread-9254-1-1.html

Angular 9 serija (VII) CSS-stil daljnogled
https://www.itsvse.com/thread-9264-1-1.html

Serija Angular 9 (VIII) posodablja vrednost podkomponente tako, da sproži dogodek preko množice
https://www.itsvse.com/thread-9267-1-1.html

Angular 9 Series (devet) #id izbirnik uporabljen na strani
https://www.itsvse.com/thread-9278-1-1.html

Angular 9 serija (10) vključuje vconsole in eruda razvijalske plošče za odpravljanje napak
https://www.itsvse.com/thread-9286-1-1.html

Angular 9 Series (XI) 5 načinov za opredelitev slogov
https://www.itsvse.com/thread-9305-1-1.html

Angular 9 serija (XII) generira dinamične žetone na podlagi OTP-jev
https://www.itsvse.com/thread-9325-1-1.html

Serija Angular 10 (trinajst) uvaja Baidu echarts karte
https://www.itsvse.com/thread-9347-1-1.html

Projekt Angular zapakiramo v produkcijsko okolje z ukazom build, pričakovani učinek pa se lahko razlikuje od tistega, ki ga vidimo v našem razvojnem okolju.

TS koda:

Prijava je vidna.

AppComponent je trenutno komponenta.

Upodobitve razvojnega in produkcijskega okolja so naslednje:

Produkcijsko okolje ni bilo prav nič takšno, kot smo pričakovali.

O podatkih ukazov za gradnjo:

Optimizacija zmogljivosti Angular gradnje
https://www.itsvse.com/thread-9203-1-1.html

Trenutno moramo odpraviti napake.
SourceMap je informacijska datoteka, ki hrani lokacijsko preslikavo izvorne kode in prevedene kode

Pri front-end delu se večinoma uporablja za reševanje odpravljanja napak v naslednjih treh vidikih:

a. Po zmedi je stiskanje kode zmedeno
b. Po prevajanju v css ali JS z uporabo drugih jezikov, kot sta sass in typeScript
c. Po večdatnem združevanju z uporabo orodij za pakiranje, kot je spletni paket

V zgornjih treh primerih ne moremo tako enostavno odpravljati napak izvorne kode kot pri odpravljanju napak, zato potrebujemo SourceMap, da nam pomaga pretvoriti izvorno kodo v konzoli za odpravljanje napak.

Moramo spremeniti ukaz gradnje, ki je naslednji:

Prijava je vidna.

(Pred dodajanjem parametrov)

(Po dodajanju parametrov)

Vidite lahko, da je ustvarjenih veliko datotek *.map.

Kot je prikazano na zgornji sliki, uporabite Google Chrome, pritisnite F12 za vstop v način za razvijalce, izberite izvorno kodo, izberite main.js in nato z desnim klikom izberite možnost »Dodaj izvorno karto« za dodajanje naslova generirane datoteke zemljevida.

Na primer:

http://127.0.0.1:8089/main.568ae4bdd06023f965c7.js.map

(Konec)

[Angular] Produkcijsko okolje serije Angular 11 (XIV) za odpravljanje napak

Sorodne objave

Ogledi odsekov