Angular 11-serie (XIV) produksjonsmiljø for feilsøking

Lille skurk · Publisert på 11.08.2020 17:59:35

Angular 9-serie (1) dynamisk lastede komponenter
https://www.itsvse.com/thread-9238-1-1.html

Vinkel 9-serie (2) dynamiske komponenttransmisjonsparametere
https://www.itsvse.com/thread-9245-1-1.html

Angular 9-serie (3) abonnerer på dynamiske komponenthendelser
https://www.itsvse.com/thread-9246-1-1.html

Angular 9-serie (IV) spesialrørledninger
https://www.itsvse.com/thread-9248-1-1.html

Angular 9 Series (V) formaterer beløpsvalutaformatet
https://www.itsvse.com/thread-9249-1-1.html

Vinkel 9-serie (VI) kaller native JS-variabler og metoder
https://www.itsvse.com/thread-9254-1-1.html

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

Angular 9-serie (VIII) oppdaterer verdien til en barnekomponent ved å utløse en hendelse via et sett
https://www.itsvse.com/thread-9267-1-1.html

Angular 9 Series (ni) #id velger brukt på siden
https://www.itsvse.com/thread-9278-1-1.html

Angular 9-serien (10) integrerer vconsole og eruda utvikler feilsøkingspaneler
https://www.itsvse.com/thread-9286-1-1.html

Angular 9-serien (XI) 5 måter å definere stiler på
https://www.itsvse.com/thread-9305-1-1.html

Angular 9-serien (XII) genererer dynamiske tokens basert på OTP-er
https://www.itsvse.com/thread-9325-1-1.html

Angular 10-serien (tretten) introduserer Baidu echarts-diagrammer
https://www.itsvse.com/thread-9347-1-1.html

Vi pakker Angular-prosjektet inn i et produksjonsmiljø med build-kommandoen, og den forventede effekten kan avvike fra det vi ser i vårt eget utviklingsmiljø.

TS-kode:

Innlogging er synlig.

AppComponent er den nåværende komponenten.

Renderingene av utviklingsmiljøet og produksjonsmiljøet er som følger:

Produksjonsmiljøet var overhodet ikke som vi forventet.

Om byggekommandodataene:

Optimalisering av vinkelbyggets ytelse
https://www.itsvse.com/thread-9203-1-1.html

Akkurat nå må vi feilsøke det.
SourceMap er en informasjonsfil som lagrer lokasjonskartleggingen av kildekoden og den kompilerte koden

I front-end-arbeid brukes det hovedsakelig til å løse feilsøkingsproblemer innen følgende tre aspekter:

a. Etter kodekomprimering er forvirret
b. Etter kompilering til CSS eller JS med andre språk som sass og typeScript
c. Etter sammenslåing av flere filer ved bruk av pakkeverktøy som webpack

I de tre ovennevnte tilfellene kan vi ikke feilsøke kildekoden like enkelt som når vi feilsøker, så vi trenger SourceMap for å hjelpe oss å konvertere den til kildekode i konsollen for å feilsøke.

Vi må endre build-kommandoen, som er som følger:

Innlogging er synlig.

(Før du legger til parametere)

(Etter å ha lagt til parametere)

Du kan se at mange *.map-filer genereres.

Som vist på bildet over, bruk Google Chrome, trykk F12 for å gå inn i utviklermodus, velg kilde, velg main.js, og høyreklikk deretter og velg alternativet «Legg til kildekart» for å legge til adressen til den genererte kartfilen.

For eksempel:

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

(Slutt)

[Kantet] Angular 11-serie (XIV) produksjonsmiljø for feilsøking

Relaterte innlegg

Seksjoner sett